Hey.

For some odd reason, event.clientX and event.clientY don't work in safari in mac os x leopard. They used to, but it appears it cannot find the object "event".

URL:

In the file (don't get confused with windowsxp.jos), the movecursor() function moves the cursor div. It works, but the event.clientX issue seems to be messing the entire function up. Why is this happening? Anything in my page that is messing it up? (notice: the url I've given will open a "launcher" webapp, and you must click on "windowsxp.jos" to load external files and see the problem)

I must be tired, and I can't explain this issue really good.

Thanks in advance, Ben.

TypeError: Result of expression 'event' [undefined] is not an object.

Dani AI

Generated

Short answer: stop depending on a global event variable. Browsers other than old IE pass the event object into the handler, they do not reliably expose a global named event. 's note that the same quick test works from the URL bar but stops working when your loader/script set is loaded strongly points to a script or the loader shadowing or clearing the event identifier (for example a var event, a function event, or an element named/id'd event).

Practical checks:

  • Grep the loaded files (including your .jos loader) for var event, function event, or any HTML element with id="event" / name="event". Rename any conflicts.
  • In the page console attach a small listener that logs the incoming event to confirm browsers are sending it: use addEventListener and inspect the e argument.
  • Make handlers accept the event parameter instead of reading a global.

A cross-browser pattern that is robust and avoids globals:

document.addEventListener('mousemove', movecursor, false);

function movecursor(e) {
  e = e || window.event;
  var x = (e.clientX !== undefined) ? e.clientX :
          (e.pageX - (document.documentElement.scrollLeft || document.body.scrollLeft));
  var y = (e.clientY !== undefined) ? e.clientY :
          (e.pageY - (document.documentElement.scrollTop || document.body.scrollTop));
  var cur = document.getElementById('yourCursorDiv');
  if (cur) {
    cur.style.left = x + 'px';
    cur.style.top  = y + 'px';
  }
}

A couple of notes tying back to earlier replies: suggested screenX/screenY — those are screen coordinates (relative to the physical screen) and usually not what you want for positioning inside the page. was pointing toward pageX which is useful as a fallback; use it only as a fallback or convert it when you need viewport (client) coordinates. Renaming any conflicting event identifiers and using parameter-based handlers will almost always resolve the problem.

Recommended Answers

All 4 Replies

clientX and clientY is supported wel in IE mode browser's. You can use screenY and screenX in safari.

ALSO TRY WITH BELOW ONE:

Event.pageX

Thanks!

clientX and y doesn't appear to be incompatible. It appears that the entire event object is not working in safari. I just did this test in my url box right now in safari 4 and it works:

javascript:document.onmousemove=moveitlol;function moveitlol(){document.body.innerHTML=event.clientX;}

Is there any kind of error in that is causing the event object to not work?

Thanks in advance.

EDIT: I tried javascript:document.onmousemove=moveitlol;function moveitlol(){document.body.innerHTML=event.clientX;} in and it didn't work. It only works if I don't load windowsxp.jos. javascript:document.onmousemove=moveitlol;function moveitlol(){document.body.innerHTML=event.clientX;} works everywhere else though.

For those needing refrence URLs, use instead.
(Sorry if you refer to this as spam, as I can't edit those posts above)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.