Javascript检测html元素是否适合屏幕

Question

有没有办法使用 javascript 来检测 html 内容是否不适合屏幕(可滚动)以仅在必要时显示“返回顶部按钮”？

Answer 1

如果您乐于使用 jQuery，您可以尝试找到窗口高度并将其与包装元素高度进行比较。如果元素高度更大，则显示按钮。

var x = $(window).height();
if ($('#test').height() > x) {
  alert('scrollable');
  //add in button here
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="test" style="height:2000px;background:silver"></div>