Получение javascript позиции мыши относительно сайта предпочтительно без jQuery - PullRequest
Новая
       18

Получение javascript позиции мыши относительно сайта предпочтительно без jQuery

0 голосов
/ 23 марта 2010

Я нашел этот фрагмент на Ajaxian, но, похоже, я не могу использовать cursor.y (или cursor.x) в качестве переменной, и когда функция вызывается как таковая, она, похоже, не работает. Есть проблема с синтаксисом или что-то еще? 

function getPosition(e) {
    e = e || window.event;
    var cursor = {x:0, y:0};
    if (e.pageX || e.pageY) {
      cursor.x = e.pageX;
      cursor.y = e.pageY;
    } 
    else {
      cursor.x = e.clientX + 
        (document.documentElement.scrollLeft || 
         document.body.scrollLeft) - 
         document.documentElement.clientLeft;
      cursor.y = e.clientY + 
        (document.documentElement.scrollTop ||
         document.body.scrollTop) - 
         document.documentElement.clientTop;
    }
    return cursor;
}

Я бы предпочел не использовать пользовательский интерфейс jQuery, если это возможно, поскольку я всегда думал, что jQuery и библиотеки - это немного излишне для большинства программ на JS.

Ответы [ 3 ]

1 голос
/ 23 марта 2010

Это всегда было трудно достичь кросс-браузер , но это почти так же хорошо, как вы можете получить ... 

<!DOCTYPE html>
<html>
  <head>
    <title>Javascript Test</title>
    <script type="text/javascript"> 
      window.onload = function() {
        document.onmousemove = function(e) {
          if(!e) e = window.event;

          if(e.pageX == null && e.clientX != null) {
            var doc = document.documentElement, body = document.body;

            e.pageX = e.clientX
                    + (doc && doc.scrollLeft || body && body.scrollLeft || 0)
                    - (doc.clientLeft || 0);

            e.pageY = e.clientY
                    + (doc && doc.scrollTop || body && body.scrollTop || 0)
                    - (doc.clientTop || 0);
          }

          document.getElementById("pos").innerHTML = e.pageX + ", " + e.pageY;
        }
      } 
    </script>
  </head>
  <body> 
    <h1>Position: <span id="pos">0, 0</span></h1>
  </body>
</html>
0 голосов
/ 10 июля 2013

// edit // На всякий случай, если я неправильно понял, вы не можете установить физическое положение мыши в JavaScript.

Так что я нашел ответ здесь, так что я просто сошлюсь на него в учебных целях. Показать мышью x и y положение с помощью javascript

Отредактировано ---- Хотел поделиться тем, что у меня получилось.

Это форма кода, который я нашел по ссылке выше, я немного изменил. Кажется, что я должен поместить определенные вещи в window.onload. 

window.onload = function () {
                IE = (navigator.appName == "Microsoft Internet Explorer") ? true : false;


    if (!IE) {
                document.captureEvents(Event.MOUSEMOVE);
                document.captureEvents(Event.MOUSEDOWN);
    }
                document.onmousemove = function (e) {mousePos(e);};

                document.onmousedown = function (e) {mouseClicked();};
};


            var mouseClick;
            var keyClicked;
            var mouseX = 0;
            var mouseY = 0;

function mousePos (e) {
    if (!IE) {
                mouseX = e.pageX; 
                mouseY = e.pageY;
    }else{
                mouseX = event.clientX + document.body.scrollLeft;
                mouseY = event.clientY + document.body.scrollTop;
    }
                return true;
}
0 голосов
/ 23 марта 2010

Этот фрагмент должен вызываться внутри обработчика событий мыши с объектом события из обработчика.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...