PDA

View Full Version : Fade in images on mouseover



netnexus
April 12th, 2003, 09:08
how do yuo change the opacity of an image so taht it is at 45% normally and when you mosueover it it becomes 100%? so it fades in and fades out once u move your mouse

CareBear
April 14th, 2003, 07:57
<head>
<script language="JavaScript">
function IsIE() {
var strUA = window.navigator.userAgent;
if (strUA.indexOf("MSIE") >= 1)
return true;
return false;
}
function FadeIn(objElem, fGradual) {
if (!fGradual) {
objElem.filters.item(0).opacity = 100;
return;
}
objFadeElem = objElem;
FadeEffect = setInterval("FadeInGradual(objFadeElem, true);", 50);
}
function FadeInGradual(objElem, fFadeIn) {
if (objElem.filters.item(0).opacity < 100) objElem.filters.item(0).opacity += 10;
else if ( (fClear == true) && (window.FadeEffect) ) clearInterval(window.FadeEffect);
}
function FadeOut(objElem) {
if (window.FadeEffect) clearInterval(window.FadeEffect);
objElem.filters.item(0).opacity = 45;
}
</script></head>

<body>
<img src="someimage.jpg" style="filter:alpha(Opacity=45, Style=0)" onMouseOver="if (IsIE()) FadeIn(this, true);" onMouseOut="if (IsIE()) FadeOut(this);">
<![endif]></body>This should work on Internet Explorer 4 and above. Netscape versions higher then 6 have an alpha filter as well but I honestly don't bother with Netscape at all so you might be better off looking around on google :)

netnexus
April 17th, 2003, 06:53
k thx