PDA

View Full Version : Choppy Fade-in slideshow



theOne
06-07-2005, 01:44 PM
Script: Fade-in slideshow
http://dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

Test Site: http://qoolio.tripod.com/
I'm using 3 images (628x340px) and it shows up very well on MSIE. But on NS and FF, the fading effects appear very choppy. Is there anyway to correct this? Greatly appreciate any advise. Many thanks.

jscheuer1
06-07-2005, 07:56 PM
Just a thought, try increasing or decreasing this number in the script:

curpos+=10

If you find a value that works well in NS/FF but it messes up IE use this:

if (document.getElementById&&!document.all)
curpos+=10 //set to NS/FF value
else
curpos+=10

theOne
06-08-2005, 04:06 AM
Thanks for your response. I've tried using many different curpos+= from 10 up, but they all flicker instead of giving anything close to a smooth fading effect on NS/FF. The best setting without the flickering is 50, but the images swicth so fast that one can barely see the fading at all :(

The example on the script page seems to fade in very smoothly on NS/FF?! Is it because they're too small to notice the choppiness? Does the image size matter?

Please help, anyone?

jscheuer1
06-08-2005, 05:19 AM
Does the image size matter?That would be a good guess. Another good question would be - "If it is the image size, is it the size in bytes or the dimensions (height and width) that are the problem?" Either or both of these can be reduced. I'll do some tests. Also, is it a problem when the slideshow is run locally?

Setting curpos to 50 in the manner I suggested in my previous post would at least make it look OK in Mozilla while retaining the fade effect in IE (the most widely used browser).

jscheuer1
06-08-2005, 06:14 AM
Tests reveal that it is the size of the images, their height and width. Also using a smaller curpos+= value produces smoother results but, drags things out more, 1 was best for smoothness. 4 seemed like a good compromise but, it causes flashing which can be eliminated by changing this:
tempobj.style.MozOpacity=curpos/101to this:

tempobj.style.MozOpacity=(curpos/100<1)?curpos/100:.99Making the total modifications changing this:
curpos+=10
if (tempobj.filters)
tempobj.filters.alpha.opacity=curpos
else if (tempobj.style.MozOpacity)
tempobj.style.MozOpacity=curpos/101to this:
if (document.getElementById&&!document.all)
curpos+=4 //set to NS/FF value
else
curpos+=10
if (tempobj.filters)
tempobj.filters.alpha.opacity=curpos
else if (tempobj.style.MozOpacity)
tempobj.style.MozOpacity=(curpos/100<1)?curpos/100:.99Individual results may vary. Tax, tag and licensing fees may apply.