javascript – 如何知道我的元素是否溢出

2023年2月3日 228次阅读

我有一个包含N个元素的滑块.当用户点击下一个按钮时,每个元素将按N个像素平移.当元素超出包装div时,它会因为被另一个元素溢出而消失.

我的插件不使用任何边距,只使用转换属性.

我想知道是否有办法知道我的元素是否超出了div. ：visible对我的问题不起作用,因为该元素已经可见但溢出.

最佳答案 如果我理解正确,一种方法是将这个元素的位置与他父母的大小(宽度/高度或两者)进行比较.

使用Jquery,你可以这样做：

<script>
  //This is the position of the right side of the element 
  //relative to his parent
  var rightPos = $("#element").position().left + $("#element").width();
  //And bottom side
  var botPos = $("#element").position().top + $("#element").height();
  if (rightPos > $("#element").parent().width()) {
    //The element is outside the right limit of the the parent block
  } else if (botPos > $("#element").parent.height()) {
    //It's outside the bottom limit of the parent block
  }
</script>

如果它不是父级,则可以调整此代码以将位置与正确div的宽度进行比较,最好使用jquery offset()方法而不是position().

点赞