PDA

View Full Version : Spry image gallery works in IE but not in firefox


qryos
05-05-2009, 05:07 AM
Hi,

I awfully new to spry and attempted to create a image gallery where a set of thumbnails is on the left-side and the detailed image is on the right. I have manage to copy and paste from different sources. I did a test in Internet Explorer but somehow it does not work in Firefox.

If some genius can solve my puzzle it would be most helpful.

here is the code below>>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:spry="http://ns.adobe.com/spry">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PLASTIC NAME BADGES | Manufacturer &amp; Supplier of Name Badges</title>

<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="../SpryAssets/xpath.js" type="text/javascript"></script>
<script src="../SpryAssets/SpryData.js" type="text/javascript"></script>
<script type="text/javascript">

var dsGallery = new Spry.Data.XMLDataSet("../data/nb_resin_dome.xml", "/gallery/photos/photo");
var dsData = new Spry.Data.XMLDataSet("../data/nb_resin_dome.xml", "/gallery");

</script>



<link href="../aca_generic.css" rel="stylesheet" type="text/css" />
</head>
<body class="wrapper">
<a name="Top" id="Top"></a>
<table width="1000" border="0" align="center" cellspacing="0" cellpadding="0">
<tr>
<td class="banner" colspan="2">
</td>
</tr>

<tr>
<td width="122"><ul id="MenuBar4" class="MenuBarVertical">
<li><a href="../index.html" class="home">HOME</a>
</li>
</ul>
</td>

<td width="878" class="MainHeader">PLASTIC NAME BADGES</td>
</tr>
<tr valign="top"><td rowspan="2" class="box"><table width="150" border="0" cellpadding="0" cellspacing="0" id="Menu">
<tr>
<td width="201">&nbsp;</td>
</tr>
<tr>
<td class="Category">BADGE PRODUCTS</td>
</tr>
<tr>
<td><ul class="MenuBarVertical" id="MenuBadges">
<li><a class="MenuBarItemSubmenu" href="#">Name Badges</a>
<ul class="box">
<li><a href="plastic_name_badges.html">Plastic<br />
Name Badges</a></li>
<li><a href="metal_name_badges.html">Metal<br />
Name Badges</a></li>
<li><a href="re-usable_name_badges.html">Re-Usable<br />
Name Badges</a></li>
<li><a href="name_badge_attachments.html">Name Badge<br />
Attachments</a></li>
<li><a href="design_layout_fonts.html">Layout Design &amp;<br />
Fonts Styles</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Button Badge</a>
<ul class="box">
<li><a href="plastic_button_badges.html">Light Weight<br />
Button Badge</a></li>
<li><a href="plastic_button_badges.html">Plastic<br />
Button Badge</a></li>
<li><a href="metal_button_badges.html">Metal<br />
Button Badge</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Name Plates</a>
<ul class="box">
<li><a href="name_plates_and_desks.html">2D Relief</a> </li>
<li><a href="name_plates_and_desks.html">Paint Infill</a></li>
<li><a href="#">Print Insert</a></li>
</ul>
</li>
<li><a href="name_plates_and_desks.html">Name Desks</a> </li>
<li><a href="id_and_wallet_badge.html">ID Badges &amp; <br />
Wallet Badges</a> </li>
</ul>
</td>
</tr>
<tr>
<td bgcolor="#EAEAEA">&nbsp;</td>
</tr>
<tr>
<td class="Category">METAL PRODUCTS</td>
</tr>
<tr>
<td><ul id="MenuMetal" class="MenuBarVertical">
<li><a href="medals_and_medallions.html">Medals &amp; Medallions</a> </li>
<li><a href="#" class="MenuBarItemSubmenu">Lapel &amp; Badge Pins</a>
<ul class="box">
<li><a href="2d_pins.html">2D Relief Pins</a></li>
<li><a href="2d_pins.html">3D Relief Pins</a></li>
<li><a href="painted_pins.html">Painted Pins</a></li>
<li><a href="printed_pins.html">Print Insert Pins</a></li>
<li><a href="service_award_pins.html">Service Pins</a></li>
<li><a href="stick_tie_pins.html">Stick Pins</a></li>
<li><a href="stick_tie_pins.html">Tie Pins &amp; Tie Bars</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Key Rings</a>
<ul class="box">
<li><a href="plastic_key_rings.html">Plastic Acrylic<br />
Key Rings</a> </li>
<li><a href="metal_key_rings.html">Metal Key Rings</a></li>
<li><a href="key_ring_attachments.html">Key Rings Attachments</a></li>
</ul>
</li>
<li><a href="corporate_and_jewellery.html">Corporate Jewellery</a></li>
<li><a href="#" class="MenuBarItemSubmenu">Belt Buckles</a>
<ul class="box">
<li><a href="belt_buckles.html">2D Belt Buckles</a></li>
<li><a href="belt_buckles.html">3D Belt Buckles</a></li>
<li><a href="belt_buckles.html">Painted Belt Buckles</a></li>
<li><a href="belt_buckles.html">Printed Belt Buckles</a></li>
</ul>
</li>
<li><a href="#">ID Tags &amp; Dog Tags</a></li>
<li><a href="trophies_and_award_plaques.html">Trophies &amp; Award Plaques</a></li>
<li><a href="metal_finishes.html">Metal Finishes</a></li>
<li><a href="metal_finishes_and_attachents.html">Metal Attachments</a></li>
<li><a href="generic_metal_shapes.html">Generic Metal Shapes</a></li>
</ul> </td>
</tr>
<tr>
<td bgcolor="#EAEAEA">&nbsp;</td>
</tr>
<tr>
<td class="Category">PRINT PRODUCTS</td>
</tr>
<tr>
<td><ul id="MenuPrint" class="MenuBarVertical">
<li><a class="MenuBarItemSubmenu" href="#">Banners Systems</a>
<ul class="box">
<li><a href="indoor_skin_banners.html">Indoor Skin Banners</a></li>
<li><a href="outdoor_banners.html">Outdoor Banners</a></li>
<li><a href="a-frame_stands.html">A- Frame Stand (Sandwich Board)</a></li>
<li><a href="x-banner_stands.html">X- Banner &amp; Stand</a></li>
<li><a href="l-banner_stands.html">L- Banner &amp; Stand</a></li>
<li><a href="retractable_banner_stands.html">Retractable Banner &amp; Stand</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Label &amp; Stickers</a>
<ul class="box">
<li><a href="stickers_labels.html">Doming Labels</a></li>
<li><a href="stickers_labels.html">Printing Labels</a></li>
<li><a href="stickers_labels.html">Window Stickers</a></li>
<li><a href="stickers_labels.html">Printed Magnets</a></li>
</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Signage &amp; Posters</a>
<ul class="box">
<li><a class="MenuBarItemSubmenu" href="signage_and_posters.html">Door Signage</a>
<ul class="box">
<li><a href="#">Item 3.1.1</a></li>
<li><a href="#">Item 3.1.2</a></li>
</ul>
</li>
<li><a href="signage_and_posters.html">Outdoor Signage</a></li>
<li><a href="signage_and_posters.html">Indoor Posters</a></li>
</ul>
</li>
<li><a href="flags_and_handwavers.html">Flags &amp; Handwavers</a></li>
<li><a href="table_cloth.html">Digital Print<br />
Table Cloth</a></li>
<li><a href="digital_print_wallpaper.html">Digital Print Wallpaper</a></li>
</ul> </td>
</tr>
<tr>
<td bgcolor="#EAEAEA">&nbsp;</td>
</tr>
</table></td>

<td height="235" class="content">Drive your image and create your impression with one of our <strong>Name Badge Designs</strong>. <br />
Manufactured in either PVC (plastic) or metal, our <strong>Name Badges</strong> has our unique protective coating, crystalline to protect your investment and image.<br />
<br />
Our experienced design team can assist in designing your name badge, taking the headache away from you. We manufacture small and large quantities and specialise in multi-location and on-going repeat orders. <br />
<br /><span class="contentBold">Select your Name Badge Style &gt;&gt;</span></td>
</tr>
<tr valign="top">
<td class="content">
<table width="800" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><table width="650" border="0" align="center" cellpadding="15" cellspacing="0" class="productTable">
<tr><td></td> </tr>
</table></td>
</tr>
<tr>
<td><table width="800" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#EAEAEA">
<tr>
<td colspan="2" class="Category"><div align="center"><a href="#ResinDomeNameBadges">Resin Dome</a> | <a href="#LaminatedNameBadges">Laminated</a> | <a href="#GoldPlasticNameBadge">Gold Plastic</a> | <a href="#SilverPlasticNameBadge">Silver Plastic</a> | <a href="#BlackPlasticNameBadge">Black Plastic</a> | <a href="#ColourPlyPlasticNameBadge">Engraved Colour-Ply</a> | <a href="#CustomCutNameBadge">Custom Shaped</a></div></td>
</tr>
<tr>
<td class="SubNavTable"><div align="center"><a href="design_layout_fonts.html">Sizes, Design Layouts &amp; Font Styles</a></div></td>
<td class="SubNavTable"><div align="center"><a href="name_badge_attachments.html">Name Badge Attachments</a></div></td>
</tr>
<tr>
<td width="400" class="SubNavTable"><div align="center"><span class="SubNavTable" style="font-style: italic"><a href="metal_name_badges.html">For Metal Name Badges Click Here</a></span></div></td>
<td width="400" class="SubNavTable"><div align="center"><span class="SubNavTable" style="font-style: italic"><a href="re-usable_name_badges.html">For Re-Usable Name Badges Click Here</a></span></div></td>
</tr>
</table></td>
</tr>
<tr>
<td><p>&nbsp;</p>
<table width="750" border="0" align="center" cellpadding="15" cellspacing="0">
<tr>
<td colspan="2" class="contentProduct"><p><span class="contentBold">Crystalline Resin Dome Name Badges</span><a name="ResinDomeNameBadges" id="ResinDomeNameBadges"></a></p>
<p>Names are printed on vinyl in PMS (CMYK) Colours. It is protected from any surface scratching by means of a crystalline resin process that coats and hardens to a dome over the printed area.</p></td>
</tr>
<tr>
<td width="270" height="155"><p><span class="description"><span style="font-weight: bold">Description</span><br />
<span style="font-weight: bold">Base:</span> White Plastic<br />
<span style="font-weight: bold">Print:</span> Full Colour CMYK Digital Print<br />
<span style="font-weight: bold">Corners Finish:</span> Square or Round<br />
<span style="font-weight: bold">Surface Finish:</span> Crystalline Resin Dome<br />
<span style="font-weight: bold">Size:</span> <a href="design_layout_fonts.html">For sizes click here.</a></span></p> </td>

<td width="420"><div align="center">
<span class="description"><a href="metal_finishes.html">
<img src="../images/badges/nb/nb_basic.jpg" alt="" width="200" height="165" border="0"/>
</a></span></div></td>
</tr>

<tr>
<td>
<div id="thumbContainer" spry:region="dsGallery dsData">
<img src="{dsData::thumbnail/@base}{@thumbpath}"
spry:repeat="dsGallery" class="thumbs"
onclick="dsGallery.setCurrentRow('{ds_RowID}');" />
</div>
</td>

<td>
<div id="main" spry:detailregion="dsGallery dsData">
<img src="{dsData::large/@base}{@path}"/><br />
Name: {@path}
</div>
</td>

</tr>
</table>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuMetal", {imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var MenuBar2 = new Spry.Widget.MenuBar("MenuBadges", {imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var MenuBar3 = new Spry.Widget.MenuBar("MenuPrint", {imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
var MenuBar4 = new Spry.Widget.MenuBar("MenuBar4", {imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</td>
</tr>


</table>

</body>
</html>

lobwl
05-22-2009, 04:48 PM
Have you got a link to your site where I can have a look and see?