На моей странице HTML5 у меня есть div сmousemove событие следующим образом:

$('#canvas').mousemove(function(e){
    xpos = e.offsetX;
    ypos = e.offsetY;
    $('#mouse').html("X : " + xpos + " ; Y : " + ypos);
});

Он отлично работает с Google Chrome. Но в Firefox оба дают значениеundefined, Я проверил это с помощью Firebug, то есть вошелe Объект для консоли. И то и другоеoffsetX а такжеoffsetY найдены, чтобы быть.undefined

Когда я искал в Google, было решение о том, что я должен использоватьlayerX а такжеlayerYесли обаoffsetX а такжеoffsetY не определены. Но из Firebug я не смог его найти. И даже я попробовал вот так:

xpos = (e.offsetX==undefined)?e.layerX:e.offsetX;
ypos = (e.offsetY==undefined)?e.layerY:e.offsetY;

Но это'также даетundefined как значения.

Я использую самый последний jQuery - v1.8.2. И я тестирую в моем Firefox v14.0.1

Есть идеи или предложения?

РЕДАКТИРОВАТЬ

Спасибо Дистрой и Вусану за помощь. Решение вышеуказанной проблемы заключается в следующем:

РЕШЕНИЕ

$('#canvas').mousemove(function(e){
  $('#cursor').show();
  if(e.offsetX==undefined) // this works for Firefox
  {
    xpos = e.pageX-$('#canvas').offset().left;
    ypos = e.pageY-$('#canvas').offset().top;
  }             
  else                     // works in Google Chrome
  {
    xpos = e.offsetX;
    ypos = e.offsetY;
  }
  $('#mouse').html("X : " + xpos + " ; Y : " + ypos);
});