I have a simple page (that I am using for experimenting) that is supposed to display the event properties set by the onmouseover event. Here is the code: <html> <head> <title>Testing Rollover Popup</title> </head> <body> <span onmouseover="divimage.style.display='block';layerXvalue.innerText=event.layerX;layerYvalue.innerText=event.layerY;pageXvalue.innerText=event.pageX;pageYvalue.innerText=event.pageY;screenXvalue.innerText=event.screenX;screenYvalue.innerText=event.screenY;" onmouseout="divimage.style.display='none';">TESTING</span> <div id="divimage" style="display:none;"><img src="C:\personal\multimedia\rainbow.gif"/></div><br/><br/> layerX:<span name="layerXvalue" id="layerXvalue"/><br/> layerY:<span name="layerYvalue" id="layerYvalue"/><br/> pageX:<span name="pageXvalue" id="pageXvalue"/><br/> pageY:<span name="pageYvalue" id="pageYvalue"/><br/> screenX:<span name="screenXvalue" id="screenXvalue"/><br/> screenY:<span name="screenYvalue" id="screenYvalue"/> </body> </html> When the onmouseover event is triggered, it displays the <div> element, the text "layerX:", and the first <span> with the value "undefined" assigned to it. It also pops up the error message: A Runtime Error has occurred. Do you wish to Debug? Line: 5 Error: 'layerYvalue' is undefined Take note that it does not say that 'layerXvalue' is undefined, so what is the difference between the two? And why is layerXvalue being assigned "undefined" instead of the value from event.layerX? Any help would be appreciated. Thanks. -- Nathan Sokalski njsokalski@hotmail.com http://www.nathansokalski.com/
Nathan Sokalski said the following on 9/12/2007 7:47 PM: [followup set to microsoft.public.scripting.jscript] > I have a simple page (that I am using for experimenting) that is supposed to > display the event properties set by the onmouseover event. Here is the code: > > <html> > <head> > <title>Testing Rollover Popup</title> > </head> > <body> > <span > onmouseover="divimage.style.display='block';layerXvalue.innerText=event.layerX;layerYvalue.innerText=event.layerY;pageXvalue.innerText=event.pageX;pageYvalue.innerText=event.pageY;screenXvalue.innerText=event.screenX;screenYvalue.innerText=event.screenY;" > onmouseout="divimage.style.display='none';">TESTING</span> > <div id="divimage" style="display:none;"><img > src="C:\personal\multimedia\rainbow.gif"/></div><br/><br/> > layerX:<span name="layerXvalue" id="layerXvalue"/><br/> > layerY:<span name="layerYvalue" id="layerYvalue"/><br/> > pageX:<span name="pageXvalue" id="pageXvalue"/><br/> > pageY:<span name="pageYvalue" id="pageYvalue"/><br/> > screenX:<span name="screenXvalue" id="screenXvalue"/><br/> > screenY:<span name="screenYvalue" id="screenYvalue"/> > </body> > </html> > > When the onmouseover event is triggered, it displays the <div> element, the > text "layerX:", and the first <span> with the value "undefined" assigned to > it. It also pops up the error message: > > A Runtime Error has occurred. > Do you wish to Debug? > > Line: 5 > Error: 'layerYvalue' is undefined Try validating your HTML with the W3C validator. Your elements have no closing tags since IE doesn't have a clue what XHTML is. Thus, <span /> doesn't close the span element. Also, try to get out of the IE trap of making names/ids global variables. It will save you a ton of trouble if you ever use something besides IE. innerText is also IE only. <URL: http://jibbering.com/faq/index.html#FAQ4_41> -- Randy Chance Favors The Prepared Mind comp.lang.javascript FAQ - http://jibbering.com/faq/index.html Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
"Nathan Sokalski" wrote: > layerX:<span name="layerXvalue" id="layerXvalue"/><br/> > layerY:<span name="layerYvalue" id="layerYvalue"/><br/> > ... > > Error: 'layerYvalue' is undefined > > Take note that it does not say that 'layerXvalue' is undefined, > so what is the difference between the two? Probably that layerXValue is inserted in the DOM, but its children are not until it is properly closed. Please note: 7.5.4 Grouping elements: the DIV and SPAN elements Start tag: required, End tag: required http://www.w3.org/TR/html401/struct/global.html#edef-SPAN Since your HTML is invalid, you should not expect anything from the DOM. > And why is layerXvalue being assigned "undefined" instead of the > value from event.layerX? Because there is no such thing in the DOM. For that matter, Microsoft's DHTML reference does not list it: http://msdn2.microsoft.com/en-us/library/ms533055.aspx Perhaps you want event.clientX or event.screenX: http://www.w3.org/TR/DOM-Level-2-Events/def-index.html Incidentally, the Gecko DOM recognizes layerX, but makes no claims about specification. In contrast, the Gecko clientX reference indicates conformance to the W3C recommendation. http://developer.mozilla.org/en/docs/DOM:event.layerX http://developer.mozilla.org/en/docs/DOM:event.clientX -- Dave Anderson Unsolicited commercial email will be read at a cost of $500 per message. Use of this email address implies consent to these terms.
