|
zamfir
Starting Member
USA
26 Posts |
 Posted - September 10 2008 : 08:42:20
|
I'm trying to set up a product display similar to the one here:
http://www.portable-grill-store.com/shopexd.asp?id=133
where there are thumbnails below the larger display, using the additional images resized for the thumbnails, and on click, swapping out the larger image with the thumbnail. I've tried everything and it's not working, see here:
http://volaretees.com/shopping/shopexd.asp?id=37
I modiefied my shoppage_header.htm like this:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=<%=getlang("langcharset")%>" />
<title><%shopdynamictitle "title"%></title>
<meta name="description" content="<%shopdynamictitle "description"%>" />
<meta name="keywords" content="<%shopdynamictitle "keywords"%>" />
<%inserturchinstats%>
<script language="javascript" src="vs350.js" type="text/javascript"></script>
<script language="JavaScript" type="text/JavaScript">
<!-- Begin
function clearfield(){
//if (document.form3.keyword.value == "search this site")
if (document.form3.keyword.value == "<%=getlang("langsearchboxdefault")%>")
document.form3.keyword.value = "";
}
// End -->
</script>
<link href="stylesheets/shop.css" rel="stylesheet" type="text/css" />
<script src="dropdown.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
<!--
.style2 {
font-size: 11px;
color: #344072;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
<!-- Begin
function clearfield(){
if (document.form3.keyword.value == "search this site")
document.form3.keyword.value = "";
}
// End -->
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0;
i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j+
+].src=a[i];}}
}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i+
+) x.src=x.oSrc;
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document;
if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)
x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++)
x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array;
for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc)
x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body>
<table id="container">
<tr>
<td class="vt">
<div id="header">
<table>
<tr>
<td width="400" ><img src="../images/VolareLogo3.gif" alt="Volare Tees" width="400" height="80" /></td>
<td width="328" class="headerlinks">
<%NavigateShowMiniCartRight "short"%> </td>
</tr>
</table>
<div class="cb"> </div>
</div>
</td>
</tr>
</table>
<table id="wrap">
<tr>
<td class="vt" colspan="2">
<div id="nav">
<!--START TOP MENU -->
<!--#include file="editor/horonavbar.html"-->
<!--END TOP MENU -->
<div class="cb"> </div>
</div>
<div id="utilbar">
<table>
<tr>
<td><a href="shopcustadmin.asp<%addSession%>"><%=getLang("langHeadMyAccount")%></a></td>
<td><%welcomenote%></td>
<td class="last">
<form method="post" action="shopsearch.asp?search=Yes" id="form3" name="form3">
<input class="searchfield" type="text" name="keyword" size="19" style="width:100" value="<%=getlang("langsearchboxdefault")%>" onclick="clearfield()" />
<input name="b1" type="submit" value="<%=getlang("langcommonsearch")%>" class="submitbtn" />
</form>
</td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td class="vt" id="left">
<!-- START CATEGORY BOX -->
<h2><%=getlang("langcommoncategories")%></h2>
<%NavigateShowCategoriesStyled%>
<!-- END CATEGORY BOX -->
<!-- START TOPSELLERS BOX -->
<h2><%=getlang("langtopsellers")%></h2>
<div class="box ac">
<%NavigateTopTen%>
</div>
<!-- END TOPSELLERS BOX -->
<!-- START FEATURED PRODUCTS BOX -->
<h2><%=getlang("langfeaturedproducts")%></h2>
<div class="box"><%NavigateFEATUREDPRODUCTS%></div>
<!-- END FEATURED PRODUCTS BOX -->
<!-- START INFORMATION BOX -->
<h2><%=getlang("langcommoninformation")%></h2>
<ul>
<li><a href="shopcontent.asp?type=shipping"><%=Server.HTMLEncode(getlang("langadminshippingreturns"))%></a></li>
<li><a href="shopcontent.asp?type=terms"><%=Server.HTMLEncode(getlang("langcommonterms"))%></a></li>
<li><a href="shopcontent.asp?type=privacy"><%=Server.HTMLEncode(getlang("langcommonprivacy"))%></a></li>
<li><a href="shopcustcontact.asp"><%=Server.HTMLEncode(getlang("langcontactus"))%></a> </li>
</ul>
<!-- END INFORMATION BOX -->
</td>
<td class="vt" id="main">
<!-- END OF SHOPPAGE_HEADER.HTM -->
and my tmp_product.htm like so:
[ADD_PAGEHEADER]
<style type="text/css">
<!--
.style3 {
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
font-style: italic;
color: #333333;
}
-->
</style>
<table width="100%" border="0" cellspacing="3" cellpadding="3">
<tr>
<td>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="3" align=left valign="top"><span class="breadcrumb">[formatbreadcrumb] </span></td>
</tr>
<tr>
<td align=left width="50%" valign="top">
<table width="100%" border="0" cellspacing="2" cellpadding="2">
<tr>
<td valign=middle align=CENTER>
<span align="left" class="price">[translate cname]</span><span class=hdrproduct> ([ccode])</span><br />
<table width="450">
<tr>
<td height="250"><div align="center"><img src="[extendedimage]" alt="[translate cname]" name="main" border="0" id="main" /></div></td>
</tr>
<tr>
<td><div align="center"><a href="#"><img src="[extraimage1]" width="100" alt="[translate cname]" name="image1" hspace="3" border="2" id="image1" onclick="MM_swapImage('main','','[extraimage1]',1)" /></a> <a href="#"><img src="[extraimage2]" width="100" alt="[translate cname]" name="image2" hspace="3" border="2" id="image2" onclick="MM_swapImage('main','','[extraimage2]',1)"/></a><a href="#"><img src="[extraimage3]" width="100" alt="[translate cname]" name="image3" hspace="3" border="2" id="image3" onclick="MM_swapImage('main','','[extraimage3]',1)" /></a></div> <div align="center"></div> <div align="center"></div></td>
</tr>
<tr>
<td><div align="center"><span class="style9 style3">Click thumbnail for larger view</span></div></td>
</tr>
</table> </td>
</tr>
<tr>
<td valign=middle align=CENTER><div align="left">[translate cdescription] </div></td>
</tr>
</table> </td>
<td bgcolor="#FF9900" width=1><img src="images/misc/shim.gif" width="1" height="25"></td>
<td><table width="100%" border="0" cellspacing="2" cellpadding="1">
$
<tr>
<td align=left>
<span class=price>[FORMATCUSTOMERPRICE cprice] </span><br />
$ <span class=pricesmall> Was <strike>[formatcurrency retailprice]</strike><br />
$ [getlang langproductpricesaving]: [formatsaving cprice]</span></p> </td>
</tr>
<tr>
<td><hr size="1" style="color:#FF9900" /></td>
</tr>
<tr>
<td align="left">
[SPECIAL_ORDERBUTTON] </td>
</tr>
<tr>
<td><hr size="1" style="color:#FF9900" /></td>
</tr>
<tr>
<td align="left">
[add_reviewlinks]
[add_ratingsummary] </td>
</tr>
<tr>
<td><hr size="1" style="color:#FF9900" /></td>
</tr>
<tr>
<td align="left">
[add_comparelinks] <br />
<br />
<a href="shoptellafriend.asp?id=[catalogid][add_websesslink]">[getlang langtellafriendheader]</a></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td align="left">
$
<p>[translate extendeddesc]</p> </td>
</tr>
</table>
[add_crossselling]
[Add_alsobought]
[ADD_PageTrailer]
Any ideas?
Thanks,
-Mark |
|
All Forums
getting thumbnail + exta images working
New Topic
Printer Friendly
Topic 
TrustGuard - PCI Security Scanner
