/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Script acts well in IE, but not Foxfire

I updated this script I found at javascriptsource.com so that it is compatible with Foxfire/Google but there’s still a problem. The script works perfect in FF/G until you scroll (whether with the center mouse wheel or the the side frame scroll bar).
The script is for googly eyes to follow your mouse. They should draw close to your mouse wherever it rests. Once you scroll, they begin to stay the distance you scrolled away from the cursor and never draw close.
The script can be observed at [url]www.kingofspaders.com/paranoia.htm[/url].
Any ideas on why FF/G can’t handle scrolling and IE can?

<script>
var brOK = true, mie = false;
//if (document.layers || document.all) brOK = true;
if (document.all) mie = true;
var ex = 0, ey = 0;
var ae, le, re, x0, y0, tid, realx, realy;
function navMove(e) {
ex = e.clientX;
ey = e.clientY;
moveeye()
return routeEvent(e);
}
function mieMove() {
ex = document.body.scrollLeft + event.x;
ey = document.body.scrollTop + event.y;
moveeye();
}
function moveeye() {
dy = ey – y0 – 20;
dx1 = ex – x0 – 20;
dx2 = ex – x0 – 60;
r = Math.sqrt(dx1 * dx1 + dy * dy);
if (r < 20) r = 20;
dx1 = dx1 * 10 / r + x0 + 10;
dy1 = dy *
10 / r + y0 + 10;
r = Math.sqrt(dx2 * dx2 + dy * dy);
if (r < 20) r = 20;
dx2 = dx2 * 10 / r + x0 + 50;
if(!mie){
ae.style.left = x0;
ae.style.top = y0;
le.style.left = dx1;
le.style.top = dy1;
re.style.left = dx2;
re.style.top = dy1;
} else {
ae.left = x0;
ae.top = y0;
le.left = dx1;
le.top = dy1;
re.left = dx2;
re.top = dy1;
}
}
function setHandlers() {
if (!mie) {
y0 = 100;
x0 = 200;
ae = document.getElementById(“eyeballs”);
le = document.getElementById(“lefteye”);

re = document.getElementById(“righteye”);

window.addEventListener(‘mousemove’, navMove, false);
//window.onMouseMove = navMove;
}
else {
y0 = document.all.eyeballs.style.pixelTop;
x0 = document.all.eyeballs.style.pixelLeft;
ae = document.all.eyeballs.style;
le = document.all.lefteye.style;
re = document.all.righteye.style;
window.document.onmousemove = mieMove;
}
realx = x0 + 0.1;
realy = y0 + 0.1;
moveall();
}
function moveall() {
rx = realx + 40;
ry = realy + 40;
rx += (ex – rx) *
0.1;
ry += (ey – ry) * 0.1;
realx = rx – 40;
realy = ry – 40;
x0 = Math.round(realx);
y0 = Math.round(realy);
moveeye();
tid = setTimeout(‘moveall()’, 100);
}
function placeeyes(x, y) {
if (brOK) {
ex = x + 40;
ey = y + 40;
s = ‘<DIV ID =”dummy” STYLE=”position:absolute; ‘ +
‘top:’+y+’; left:’+x+’; width:10; height:10;”> </DIV>’;
s += ‘<DIV ID=”eyeballs” STYLE=”position:absolute; ‘ +
‘top:’+y+’; left:’+x+’; width:80; height:40;”><IMG SRC=’ +
‘”http://www.parrfunding.com/kingofspaders/images/new/whites.gif” border=0></DIV>’;
s += ‘<DIV ID=”lefteye” STYLE=”position:absolute; ‘ +
‘top:’+(y+10)+’; left:’+(x+10)+’; width:20; height:20;”>’ +
‘<IMG SRC=”http://www.parrfunding.com/kingofspaders/images/new/pupil.gif” border=0></DIV>’;
s += ‘<DIV ID=”righteye” STYLE=”position:absolute; ‘ +
‘top:’+(y+10)+’; left:’+(x+50)+’; width:20; height:20;”>’ +
‘<IMG SRC=”http://www.parrfunding.com/kingofspaders/images/new/pupil.gif” border=0></DIV>’;

//document.writeln(s);
var eyeContainer = document.createElement(“div”);
eyeContainer.setAttribute(‘id’, ‘eyeContainer’);
document.body.appendChild(eyeContainer);
document.getElementById(‘eyeContainer’).innerHTML = s;
}
}
function clearEyes() {
if (tid) clearTimeout(tid);
}
// End –>
</script>

to post a comment
JavaScript

5 Comments(s)

Copy linkTweet thisAlerts:
@sirluckauthorMar 08.2012 — Perhaps FF fails to pass scroll information to they Y axis variable?
Copy linkTweet thisAlerts:
@sirluckauthorMar 08.2012 — I believe it's these lines that are the problem:

ex = e.clientX;

ey = e.clientY;

I saw another thread replacing those with:

document.onmousemove=function(e) {

var e=e||window.event,

coordX=null,

coordY=null;

if(typeof(e.pageX)!=undefined) {

coordX=e.pageX;

coordY=e.pageY;

} else if(typeof(e.clientX)!=undefined) {

coordX=e.clientX+document.body.scrollLeft;

coordY=e.clientY+document.body.scrollTop;

}

}

but I don't really know how to fit that into my script.
Copy linkTweet thisAlerts:
@sameasinMar 08.2012 — Guys,

Answer is damn simple.....

document.all is an IE specific code and not W3C compliant which Firefox or other browsers won't interpret. You need to use

document.getElementsByTagName('*')
Copy linkTweet thisAlerts:
@sirluckauthorMar 09.2012 — Thanks for your reply. Could you demonstrate how to use it in that script? I'm just a hack, not trained in programming.
Copy linkTweet thisAlerts:
@sirluckauthorMar 10.2012 — a simple replace of document.all didnt work for me.
×

Success!

Help @sirluck spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...