Forum Moderators: open

Message Too Old, No Replies

css opacity, fade in, fade out

         

cajmilfo

12:33 pm on Feb 17, 2005 (gmt 0)

10+ Year Member



Hello,

i tried to find a script that will do a fade in fade out effect, here it is, but it's not functional under Opera, FireFox 1.0 (it's flickering, the event onmouseout, onmouseover are not functioning properly, at least it looks so)
btw i finded out on the net that opera is not supporting opacity now, it's shame. Does anybody know if there is any workaround to make it fading under opera?

thanks

PS: i tried to make the script work with opacity attribute but it wasnt working so i dunno


<html>
<head>

<style type="text/css">

img {
filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;">
}
.img2 {
filter:alpha(opacity=0);-moz-opacity:1;opacity:1;">
}

</style>
<SCRIPT language=JavaScript src="fading.js" type=text/javascript></SCRIPT>
<SCRIPT type="text/javascript">

var highlighting1 = null;
var lowlighting1 = null;

function high1(which2) {

clearInterval(lowlighting1)
theobject1=which2
highlighting1=setInterval("highlightit1(theobject1)",50)
}

function low1(which2) {

clearInterval(highlighting1)
theobject1=which2
lowlighting1=setInterval("lowlightit1(theobject1)",50)
}

function lowlightit1(cur2) {

if (cur2.style.MozOpacity > 0.5)
cur2.style.MozOpacity=parseFloat(cur2.style.MozOpacity)-0.05
else if (cur2.filters&&cur2.filters.alpha.opacity>50)
cur2.filters.alpha.opacity-=5
else if (window.lowlighting1)
clearInterval(lowlighting1)
}

function highlightit1(cur2){
if (cur2.style.MozOpacity<1)
cur2.style.MozOpacity=parseFloat(cur2.style.MozOpacity)+0.05
else if (cur2.filters&&cur2.filters.alpha.opacity<100)
cur2.filters.alpha.opacity+=5
else if (window.highlighting1)
clearInterval(highlighting1)
}

function getObj(str) {

return(document.getElementById(str));

}

</SCRIPT>

</head>

<body id='platz' style='overflow:hidden;'>

<div id="layerforum" style="position:absolute; left:0px; top:0px; width:89px; height:95px; z-index:4">
<img src="forum.png" id="imgforum" style="width:89px; height: 95px; -moz-opacity:0.5;" galleryimg="false" border="0" usemap="#forummap"/>
<MAP NAME="forummap">
<AREA SHAPE="POLYGON" COORDS="1,69,1,77,40,95,41,94,50,83,60,71,71,55,79,40,85,27,88,19,87,13,43,1,35,20,26,36,15,52,1,69,2,70" onClick="" onmouseover="high1(getObj('imgforum'))" onmouseout="low1(getObj('imgforum'))">
</MAP>
</div>

</body>
</html>

orion_rus

8:47 pm on Feb 17, 2005 (gmt 0)

10+ Year Member



Hmm i think it should work on FireFox but with Opera it's seems to be true. I cann't get any opacity value for it and it shows like with opacity=100%(
I'm sorry i can't help you with this