Click to See Complete Forum and Search --> : Script problem NEED HELP


Squirrel448
01-06-2003, 03:53 PM
I am not very good at javascript, and i was wondering if anyone could rewrite this script so that it will work in a Mozilla browser (from www.mozilla.org). someone told me how to fix it, but i still didnt understand what they were talking about. ill show ya the message...
__________
> is there any way to rewrite the script or the page so that it performs
> the same function in windows ie then?

I thought I had given sufficient pointers to do that in my comments...

As for opacity. the code will look very similar; you'll need to set object.style.MozOpacity instead of setting object.filters.whatever (and probably condition that on the presence of document.all).

Boris
__________

I have the script at http://www.windedhero.com/cgi-bin/fade.js.
the goal of this script is to make an object fade to 80% opacity when a mouse passes over it, and to return to 100% opacity after the mouse moves out. there is an active example at http://www.windedhero.com/board/index.shtml, as it works in microsoft internet explorer, but it will not work in a Mozilla explorer. and in case you're too lazy, i have attached fade.js as a text document to this post.

Squirrel448
01-08-2003, 09:32 PM
Is there even anybody here that knows how to do this?

TheBearMay
03-09-2004, 01:35 PM
I must have missed this over the holidays, but if you're still interested this script bounces and fades an image at the same time. Works on IE6 and FireBird.

var browseIE = navigator.appName;
if(browseIE == "Microsoft Internet Explorer") browseIE = true;
else browseIE = false;
var tempY = 0;
var tempX = 0;
var yDir=1;
var xDir=1;
var imgTimer;
var opFilt=100;
var fadeVal=1;
function bounceImage(imgName){
if (browseIE)
document.getElementById(imgName).style.filter="alpha(opacity="+opFilt+")";
else document.getElementById(imgName).style.MozOpacity=opFilt/100;
opFilt=opFilt-fadeVal;
if(opFilt <= 0 || opFilt >= 100) fadeVal=fadeVal*(-1);
document.getElementById(imgName).style.top = tempY;
document.getElementById(imgName).style.left = tempX;
tempY=tempY+(1*yDir);
tempX=tempX+(1*xDir);
if ((tempX + document.getElementById(imgName).offsetWidth) >
document.getElementById(imgName).offsetParent.offsetWidth || tempX <= 0)
xDir=xDir*(-1);
if ((tempY + document.getElementById(imgName).offsetHeight) >
document.getElementById(imgName).offsetParent.offsetHeight || tempY <= 0)
yDir=yDir*(-1);
if (imgTimer) clearTimeout(imgTimer);
imgTimer=setTimeout("bounceImage('"+imgName+"')",50);
}
...
<div id="divImg" style="position:absolute; top: 0px; left: 0px;">
<img src="yourImage.gif" title="yourImage" onclick="bounceImage('divImg');"/>
</div>