javascript - Jquery-事件 : mouse X position is within element's vertical borders range

Question

当鼠标 X 位置在类的垂直边界范围内时，我需要处理该事件。我的意思是，如果元素的 X 位置是:

X: 200px;
X+element.width(): 500px;

我想知道鼠标是否在水平方向上(200px，500px)。它的垂直位置无关紧要。这是一些进一步的解释:

如有任何帮助，我们将不胜感激。

Answer 1

下面的代码是不言自明的:

function isWithinBoundries($el, ev) {
  var x = ev.pageX,
      leftBound = $el.offset().left,
      rightBound = leftBound + $el.width();
  
  return (x > leftBound && x < rightBound) ? true : false;
}

$(document).ready(function() {
  var $elem = $('.myDiv');
  
  $(document).on('mousemove', function(e){
    $elem.html(isWithinBoundries($elem, e) + '');
  });
});

body {
  margin-left: 0;
}

.myDiv {
  width: 300px;
  margin-left: 200px;
  padding: 5px;
  background-color: #ccc;
  text-align: center;
  line-height: 3;
}

<div class="myDiv">false</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>