Jump to content

"window.event Not Defined" Only In Ff


GerryH
 Share

Recommended Posts

I'm sorry if this has been addressed before, but after Googling my head off, I'm still stuck in the mud. Simply I'm getting the mouse coords so I can position an element, which works great in Chrome, Opera, Safari, and even (GULP) IE, but FF kicks the error "window.event not defined". I've tried several varations, and tried some suggestions I found on google, but still no joy.

function showTip(e){	var evt = window.event? event : e  	var tip = document.getElementById('tool');	tip.innerHTML = ""+evt.clientX+" "+evt.clientY+"";	tip.style.left = ""+evt.x+"px";	tip.style.top = ""+evt.y+"px";	tip.style.visibility = "visible";}

<div class="tooltip" id="tool" onmousemove="showTip(event)" onmouseout="hideTip()">

Any ideas would be welcomed, thanks!

Link to comment
Share on other sites

Thank's for the quick reply DD, but still kicks me in the teeth tossing the same error "evt is undefined if FF".

function showTip(e){	var evt = e || window.event;	//var evt = window.event? event : e 	var tip = document.getElementById('tool');	tip.innerHTML = ""+evt.clientX+" "+evt.clientY+"";	tip.style.left = ""+evt.x+"px";	tip.style.top = ""+evt.y+"px";	tip.style.visibility = "visible";}

This is using FF version 3.0.14 BTW.Thanks again for responding! :)

Link to comment
Share on other sites

Weird. I stripped it down to just this, and it works fine:

function showTip(e){	var evt = e || window.event;	alert (evt);}

Try putting this line at the top of the function as a temporary test:alert(e);return;If e still comes up undefined, then the event is not getting passed to the function correctly. But I'm using your <div> tag also, and it works for me. So that would be a puzzle.

Link to comment
Share on other sites

I wonder if part of the problem is using onmousemove instead of onmouseover . No one much uses the former anymore. Try changing it.If that doesn't work, or even if it does, try assigning the handlers in the script itself (which is best practice anyway):

function init () {	document.getElementById("tool").onmouseover = showTip;	 document.getElementById("tool").onmouseout = hideTip; }window.onload = init;*	 *	 *<div class="tooltip" id="tool">

The absence of quotes and parentheses is correct, by the way. We're assigning a function reference, not a string to be evaluated. The event object is passed implicitly.

Link to comment
Share on other sites

made amendments and works fine(1) closing </div> tagEdit: (2) x and y are undefined possibly should be tip.style.left = ""+evt.clientX+"px"; tip.style.top = ""+evt.clientY+"px";(3)created hideTip() function(4)temporarily div height, width to 100px.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><script type="text/javascript">/*<![CDATA[*//*---->*/function showTip(e){ var evt = window.event? event : e var tip = document.getElementById('tool'); tip.innerHTML = ""+evt.clientX+" "+evt.clientY+""; tip.style.Left = ""+evt.x+"px"; tip.style.Top = ""+evt.y+"px"; tip.style.visibility = "visible";}function hideTip(){alert("just moved outside of div")}/*--*//*]]>*/</script> <style type="text/css">#tool {height:100px; width:100px; background-color: #FFFF99;}</style></head><body><div class="tooltip" id="tool" onmousemove="showTip(event)" onmouseout="hideTip()"></div></body></html>

Edited by dsonesuk
Link to comment
Share on other sites

My bad!, should be lowercase, think i thinking of borderLeft etc, I should have checked, I changed to Left and javascript warning cleared.the problem with is ""+evt.y+"px" where y or x is defined, i don't know if this is defined somewhere else? or should they set with ""+evt.clientY+"px" or ""+evt.clientX+"px", if so you will need to set postioning to tip.style.position="relative";.

Link to comment
Share on other sites

Thanks for all the help gents, but I think I have some other side issues on this page other than the snippet I provided. First trying the mouseover event didn't change anything (actually that event isn't really desirable for the "tool-tip" effect) however assigning the function to the event(s) in script rather than HTML worked without any problem.I believe something else in my scripts or perhaps my nasty nested tables :) is stoming on the event object in FF, as like DD had tried, had no problems isolating just that one function In a simple single <div> in the body.Thanks again!

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...