This script will "Splash" the screen with thumbnails, hovering over the image brings it to the foreground and zooms it, clicking on it then links you to detail page. If you like the script please try to provide me some help with my eof bof problem in javascript forum! Yes this is a bribe!
P.S Images (thumbnails, zoomed and coverage) adjust to window size.
Code:
<script language="jscript" runat="server">
ProductData.MoveFirst
for (x=1;x<=ProductData.RecordCount;x=x+1)
{
var ProdID=ProductData.Fields("ID");
Response.Write("#Layer"+x+"{\r");
Response.Write("width: 0px;\r");
Response.Write("position: absolute;\r");
Response.Write("z-index:-1;\r");
Response.Write("}\r");
Response.Write("#Layer"+x+":hover{\r");
Response.Write("width: auto;\r");
Response.Write("z-index: 1;\r");
Response.Write("}\r");
Response.Write("#Pic"+x+"{\r");
Response.Write("width: expression(document.body.clientWidth*.2);\r");
Response.Write("max-height: 300px;")
Response.Write("}\r");
Response.Write("#Pic"+x+":hover {\r");
Response.Write("width: expression(document.body.clientWidth/2);\r");
Response.Write("}\r");
ProductData.MoveNext;
}
Response.Write("</st")
Response.Write("yle>\r")
Response.Write("</he")
Response.Write("ad>\r")
Response.Write("<bo")
Response.Write("dy>\r")
ProductData.MoveFirst
for (x=1;x<=ProductData.RecordCount;x=x+1)
{
var Top=Math.random()
var Left=Math.random()
var ProdID=ProductData.Fields("ID");
var MenuItem = ProductData.Fields("Menu");
Response.Write("<div id= 'Layer"+x+"' style= 'left:expression("+Left+"*1.2*document.body.clientWidth-40); top:expression("+Top+"*.8*screen.availheight-50);'><a href='/Panel.asp?MenuItem= "+MenuItem+"&ProdID="+ProdID+"&SrtStr=none&Spin=none'");
Response.Write(" target='Panel'><img id= 'Pic"+x+"' border= -1 src='/images/Products/"+ProdID+".png' /></a></div>\r");
ProductData.MoveNext;
}
ProductData.Close
</script>
Last edited by Sleeping Troll; 05-26-2008 at 02:05 AM..
|
