Spry Gallery on I.E. and Safari

Question

I'm new with SPRY framework I'm adopting the gallery.
My code works well with Mozilla but its now working well with
Safari and I.E.
Whats the problem?
Here's my code:
<div spry:region="dsGallery " spry:repeat="dsGallery"
spry:test="'{@base}'.match(/<?php echo $task;?>/);"
spry:choose="choose">
<div spry:when="'{@base}'.match(/<?php echo
$task;?>/);
dsGallery.setCurrentRow('{ds_RowID}');"></div>
</div>
<table cellpadding="0" cellspacing="0"
border="0"><tr class="gallery">
<td><a
href="component/option,com_gallery/task,gallery/Itemid,53/">&laquo; </a></td>
<td
spry:region="dsGallery">{sitename} </td>
<td
spry:detailregion="dsAlbum">&raquo; {name}</td>
</tr></table>
<table>
<tr><td id="selectAlbum" align="left"
spry:region="dsAlbum">
<select class="albumName"
spry:repeatchildren="dsAlbum">
<option
onclick="dsAlbum.setCurrentRow('{ds_RowID}');">{name}</option>
</select>
</td></tr>
<tr><td id="previews">
<div id="thumbnails" spry:region="dsPhoto dsAlbum
dsGallery">
<div spry:repeat="dsPhoto"
onclick="HandleThumbnailClick('{ds_RowID}');"
onmouseover="GrowThumbnail(this.getElementsByTagName('img')[0],
'{@thumbwidth}', '{@thumbheight}');"
onmouseout="ShrinkThumbnail(this.getElementsByTagName('img')[0]);"><img
id="tn{ds_RowID}" alt="thumbnail for {@path}" src="<?php echo
$url_xml;?>/{dsGallery::@base}{dsAlbum::@base}{@stored}{@path}"
width="24" height="24" style="left: 0px; right: 0px;" />
</div>
<p class="ClearAll"></p>
</div>
</td></tr>
</table>
<br /><br />
<div align="center">
<table cellpadding="0" cellspacing="0">
<tr><td align="center">
<table cellpadding="0" cellspacing="0" style="border:
10px solid #fffff3;">
<tr><td align="center"><img id="mainImage"
alt="main image" /></td></tr>
</table>
</td></tr>
<tr><td class="title" align="center"
spry:detailregion="dsPhoto">{@caption} </td></tr>
</table>
</div>
Thank you.

Answer 1

thanks for the reply! I figured it out already. Though I have
one more concern,
I would like my thumbnails to appear in rows and right below
it, I would like to display each gallery title, but it keeps piling
in one column.
here's its code after running through php.
<table cellspacing="0" border="0">
<tr><br /><td class="rule">*Click
thumbnails to view each gallery.</td></tr>
</table>
<div spry:region="dsGallery">
<div id="gal_thumbnail"
spry:repeatchildren="dsGallery">
<div >
<a
href="component/option,com_gallery/task,{@base}/Itemid,53/"
title="{sitename}">
<img src="
http://localhost/stevemurrell.com/images/gallery/{dsGallery::@base}{dsGallery::@thumb}"
alt="{sitename}"
onmouseover="dsGallery.setCurrentRow('{ds_RowID}');"></a>
{sitename}
</div>
</div>
</div>