Dynamically generate anything slider in asp.net

Question

I am working on a project that requires generation of AnythingSlider http://css-tricks.com/examples/AnythingSlider on dynamic basis. I mean values are stored in database and I want to generate multiple sliders at a time, based on the values from the database.

I am able to generate the actual code but despite of every thing being correct, I am unable to make it work correctly. I am a little new to jQuery so, it might just be the problem with calling the event at the incorrect time.

Following is the string generated

           <ul id='3'>
                <li>
                    <div class='div_slider_content'>
                    <table>
                    <tr><td><img src='PackImages/img1.jpg' width='160px' height='120px'></img></td></tr>
                    <tr><td><a href='~/PackageDetailsPage.aspx?name=This_is_a_Title&i=3'>Read More</a></td></tr>
                    </table>
                    </div>
                </li>
            </ul>
          <ul id='4'>
                <li>
                    <div class='div_slider_content'>
                    <table>
                    <tr><td><img src='PackImages/Img2.jpg' width='160px' height='120px'></img></td></tr>
                    <tr><td><a href='~/PackageDetailsPage.aspx?name=This_is_another_Title&i=4'>Read More</a></td></tr>
                    </table>
                    </div>
                </li>
            </ul>

<script type="text/javascript">
 $(document).ready(function(){
$('#3').anythingSlider({ 
    width: 234, 
    height: 150, 
    buildNavigation: false, 
    enableNavigation: false, 
    autoplay: false, 
    startStopped: true, 
    showMultiple: true
    });
$('#4').anythingSlider({ 
    width: 234, 
    height: 150, 
    buildNavigation: false, 
    enableNavigation: false, 
    autoplay: false, 
    startStopped: true, 
    showMultiple: true});
});
});
</script>

All this structure is written in a Literal Control, and is added to the control on the Page Load event. Please help ^^

Answer 1

As I mentioned in the forum post at CSS-Tricks. The code above is showing two sliders with one panel per slider. AnythingSlider is set up to not add navigation arrows nor navigation tabs when only one panel exists. So add additional panels to verify the slider is working.