Image Thumbnail Viewer, slower fade.

[Smasher]

1) Script Title: Image Thumbnail Viewer

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm

3) Describe problem:
Thank you for a nice script. Excactly what i've been looking for, for about 4 hours yesterday

I have one question/wish.
Can you either change the javascript file, so when you click the image, it will open/fade in a bit slower. Like a sec or so?

Or combine it with jquery?

I have looked at Image Thumbnail Viewer 2, but I don't like that it dosn't closes the image again when you click it... Image Thumbnail Viewer 1 is perfekt for me.

[jscheuer1]

Find this function in the thumbnailviewer.js script (around line #45):

showthumbBox:function(){ //Show ThumbBox div
thumbnailviewer.thumbLoading.style.visibility="hidden" //Hide "loading" div
this.centerDiv(this.thumbBox)
if (this.enableAnimation){ //If fading animation enabled
this.currentopacity=0.1 //Starting opacity value
this.opacitytimer=setInterval("thumbnailviewer.opacityanimation()", 20)
}
},

See the highlighted line and the red number. This is the number of milliseconds between each step in the fade in animation for this script. Increase that number to - say, 40 or 60. Much higher than that would probably be too slow or too choppy.

This is different than jQuery, where a number like this would set the duration of the effect. This number sets the duration of each step of the effect. So it should be smaller than a jQuery duration figure by a factor of 10 (there are about 10 steps in this animation).

If you want to increase the number of steps, go here (around line #94):

opacityanimation:function(){ //Gradually increase opacity function
this.setimgopacity(this.currentopacity)
this.currentopacity+=0.1
if (this.currentopacity>1)
this.stopanimation()
},

Setting that number to - say 0.05, will get you about twenty steps. That will also slow things down, and perhaps more smoothly than increasing the amount of time between steps will. Ideally this number should divide evenly into 1, and that result will be the approximate number of steps for the animation.

You may find it best to play with both numbers a bit before you get what you want.

[Smasher]

Thank you very much

I have actually played with those excact numbers, but I changed them to something like 1000, which with jquery is 1000ms=1 sec. So nothing really happened, lol.

Number 30
And 0.03
Seems to be perfect for me