Hi all.

I have been scratching my head for a while on this one. I dont really play around with HTML formatting that often.

I have a smoothDivScroll using JQuery (http://maaki.com/thomas/SmoothDivScroll/) to scroll through dynamically generated images.

What I want it for, is to have multiple small images lined up right next to each other, and each image has a section of writting underneath. about 25 images, 140px width each in a 7560px span.

I acheived this great by putting a table inside the div, and each image inside a<td>.This works

problem i have, is that i need the slider to start from the furthest RIGHT image, and slide automatically left. This is acheived by (if you look at the link above) - startAtElementId:

But if I am using a table inside the div, it is taking the TABLE as a element and not the TD... so it doesnt work. I know this because if I change every image to be inside tables (i.e 25 tables), it works... but obviously then the formatting is not how I want.

Can anyone think of a way I can use this slider (modifications to the js code or not), with 25 images that NEED to be right next to each other, no gap.

I guess this is more of a formatting question, than about the slider. Because I only know ONE way of doing what I want, and thats to have below which will not alow me to set startAtElementId.

    <div class="scrollableArea">
        <table width="7560px" class="index-body">
        <tr> 
        <td width="140px"><center><a onclick="__doPostBack('getEarlierDate');" ><img src="../images/olderGraphs.gif" width="140" height="60"></a>Click for more</center></td>
        <td width="300px"><center><a onclick="__doPostBack('chartClicked25');" ><cewolf:img chartid="verticalbar25" renderer="cewolf" width="300" height="60"/></a><c:out value="${date25}"/></center></td>
        <td width="300px"><center><a onclick="__doPostBack('chartClicked24');" ><cewolf:img chartid="verticalbar24" renderer="cewolf" width="300" height="60"/></a><c:out value="${date24}"/></center></td>

and so on