Question

我正在编写一些jQuery来检查鼠标是否靠近窗口的底部或右侧，并相应地重新定位工具提示。这很重要，因为这些工具提示出现的表格大于'viewport'

只有当所有屏幕尺寸相同时，这样的事情才有效：

$( document ).on( "mousemove", function( event ) {
  $( "#log" ).text( "pageX: " + event.pageX + ", pageY: " + event.pageY );
});

如何将右下角计为“0x0”？

Answer 1

如果您想获得右下方的坐标，请分别从窗口event.pageX和event.pageY中减去width和height角。

＆＃13;

$(document).on("mousemove", function(event) {
  $("#log").text("pageX: " + ($(window).width() - event.pageX) + ", pageY: " + ($(window).height() -event.pageY));
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="log"></div>

＆＃13;

Answer 2

从坐标中减去窗口宽度：

$(document).on("mousemove", function(event) {
  var winWidth = $(window).width();
  var winHeight = $(window).height();

  console.log(
   "pageX: " + (winWidth - event.pageX),     
   "pageY: " + (winHeight - event.pageY) 
  );
});

Answer 3

你需要计算窗口的宽度和高度，然后找出鼠标位置和那些变量之间的差异。

这可以解决您的问题：

    $( document ).on( "mousemove", function( event ) {
// breakdown of variables
    var w = window.innerWidth;
    var h = window.innerHeight;
    var posFromRight = w-event.pageX;
    var posFromBottom = h-event.pageY;

// then use them to position your tooltip
    $('.tooltip').css({
          "position": 'absolute',
          "bottom": posFromBottom,
    "right": posFromRight
        });
    });

从窗口右下角计算鼠标位置？

3 个答案: