Img Opacity fade not working

software development

#1

Hi,

I am trying to make an image fade in, but it is not working in FF or Opera (haven’t tried Safari, but I figure the code is probably wrong already so no need to try). It works just fine in IE, but of course in IE I have used their version of the opacity… anyway, here’s the code.

<script type="text/javascript"> var logoEffectInterval; function addLogoImgOpacity() { clearInterval(logoEffectInterval); var filterOpacity = document.getElementById('kufitlogoheading').filters.alpha.opacity; var regulrOpacity = document.getElementById('kufitlogoheading').style.opacity; document.getElementById('kufitlogoheading').style.opacity = 1; if(filterOpacity < 5 || regulrOpacity < 0.1) { document.getElementById('kufitlogoheading').filters.alpha.opacity += 5; document.getElementById('kufitlogoheading').style.opacity += 0.1; logoEffectInterval = setInterval("addLogoImgOpacity()", 1200); } else if(filterOpacity < 20 || regulrOpacity < 0.4) { document.getElementById('kufitlogoheading').filters.alpha.opacity += 10; document.getElementById('kufitlogoheading').style.opacity += 0.1; logoEffectInterval = setInterval("addLogoImgOpacity()", 220); } else if(filterOpacity < 55 || regulrOpacity < 0.7) { document.getElementById('kufitlogoheading').filters.alpha.opacity += 15; document.getElementById('kufitlogoheading').style.opacity += 0.2; logoEffectInterval = setInterval("addLogoImgOpacity()", 150); } else if(filterOpacity < 100 || regulrOpacity < 1.0) { document.getElementById('kufitlogoheading').filters.alpha.opacity += 20; document.getElementById('kufitlogoheading').style.opacity += 0.2; logoEffectInterval = setInterval("addLogoImgOpacity()", 100); } } document.write('<img src="http://www.kustomfitness.com/KFbanner3.png" id="kufitlogoheading" alt="Kustom Fitness" onload="addLogoImgOpacity()" style="filter:alpha(opacity=0);opacity:0.0"'); </script> <noscript> <img src="http://www.kustomfitness.com/KFbanner3.png" id="kufitlogoheading" alt="Kustom Fitness"> </noscript> So I figure if the browser does not support a version of the opacity filter, then it will just kind of be ignored (since it probably also then does not have a way of detecting what the opacity is set at and thus would not cause an infinite loop).

I have no idea why this isn’t working, so any help would be appreciated.

Thanks.


#2

This works…

[code]

Kustom Fitness [/code] :cool: [url=http://openvein.org/]openvein.org[/url] -//- [b]One-time [color=#6600CC]$50.00 discount[/color] on [color=#0000CC]DreamHost[/color] plans: Use ATROPOS7[/b]

#3

Hey,

Thanks a lot for your help. I acutally just figured out a couple minutes ago that if the browser was not internet explorer and it had .filters.alpha.opacity in the script that it stopped the script (I was about to just use an if IE conditional comment for it).

Also, I was not aware of this “KHTMLopacity” so thanks for that too.