Script: Image thumbnail viewer II IE

[jpozzi]

Help please; I am new to this.

I am using this but can't get the fade effect to work. I have changed the values for gradient size and duration repeatedly with no result at all.

The effect works fine on the demo example over the internet.

Can anybody help?

[cr3ative]

Hiya - please post a link to your troubled website or your code wrapped in the appropriate bbcode tags {code} {/code}

cr3ative

[jpozzi]

hi,

This is the code in the Head section:

<script type="text/javascript">

/***********************************************
* Image Thumbnail Viewer II script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use
***********************************************/

//Specify image paths and optional link (set link to "" for no link):
var dynimages=new Array()
dynimages[0]=["images/hgproductsimage1big.jpg", ""]
dynimages[1]=["images/hgproductsimage2big.jpg", ""]
dynimages[2]=["images/hgproductsimage3big.jpg", ""]
dynimages[3]=["images/hgproductsimage4big.jpg", ""]
dynimages[4]=["images/hgproductsimage5big.jpg", ""]
dynimages[5]=["images/hgproductsimage6big.jpg", ""]
dynimages[6]=["images/hgproductsimage7big.jpg", ""]
dynimages[7]=["images/hgproductsimage8big.jpg", ""]
dynimages[8]=["images/hgproductsimage9big.jpg", ""]



//Preload images ("yes" or "no"):
var preloadimg="yes"

//Set optional link target to be added to all images with a link:
var optlinktarget=""

//Set image border width
var imgborderwidth=1

//Optionally, change 1.0 and 0.7 below to affect Wipe gradient size and duration in seconds in IE5.5+:
var filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=5 Duration=5000)"

///////No need to edit beyond here/////

if (preloadimg=="yes"){
for (x=0; x<dynimages.length; x++){
var myimage=new Image()
myimage.src=dynimages[x][0]
}
}

function returnimgcode(theimg){
var imghtml=""
if (theimg[1]!="")
imghtml='<a href="'+theimg[1]+'" target="'+optlinktarget+'">'
imghtml+='<img src="'+theimg[0]+'" border="'+imgborderwidth+'">'
if (theimg[1]!="")
imghtml+='</a>'
return imghtml
}

function modifyimage(loadarea, imgindex){
if (document.getElementById){
var imgobj=document.getElementById(loadarea)
if (imgobj.filters && window.createPopup){
imgobj.style.filter=filterstring
imgobj.filters[0].Apply()
}
imgobj.innerHTML=returnimgcode(dynimages[imgindex])
if (imgobj.filters && window.createPopup)
imgobj.filters[0].Play()
return false
}
}

</script>

this is in the body:

<TD vAlign=middle align=center width=380
height=280 border=0 background="images/dynareabg.jpg" width="380" height="280" alt="" border="0"><div id='dynloadarea'></div></TD>
<td width=380 valign=top><img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',0)"><img src="images/hgproductsimage1.jpg" width="100" height="79" alt="" border="1"></a><img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',1)"><img src="images/hgproductsimage2.jpg" width="100" height="79" alt="" border="1"></a><img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',2)"><img src="images/hgproductsimage3.jpg" width="100" height="79" alt="" border="1"></a><br><br>
<br>
<img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',3)"><img src="images/hgproductsimage4.jpg" width="100" height="78" alt="" border="1"></a><img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',4)"><img src="images/hgproductsimage5.jpg" width="100" height="78" alt="" border="1"></a><img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',5)"><img src="images/hgproductsimage6.jpg" width="100" height="78" alt="" border="1"></a><br><br>
<br>

<img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',6)"><img src="images/hgproductsimage7.jpg" width="100" height="79" alt="" border="1"></a><img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',7)"><img src="images/hgproductsimage8.jpg" width="100" height="79" alt="" border="1"></a><img src="images/spacer.gif" width="20" height="10" alt="" border="0"><a href="#" onMouseover="modifyimage('dynloadarea',8)"><img src="images/hgproductsimage9.jpg" width="100" height="79" alt="" border="1"></a><br>
<br><font size="3">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Move mouse over picture to see larger image</font>

</td>


As I said, I am new to this, thanks for getting back to me.

[ddadmin]

Warning: Please include a link to the DD script in question in your post. See this thread for the proper posting format for asking a question.

I don't see anything wrong with the code posted. What's the URL to the problematic page on your site?

[jpozzi]

Many thanks for looking.

It is a mystery; I created a blank page with just the code required and it worked fine. I then copied that code into the original page and it didn't work. I then took out all other code on the original page and it still didn't wok. I then had two identical pages, one worked, the other didn't!!! I am now putting the rest of the code into the one that works.

Again, many thanks