Jala015 Jala015 - 2 months ago 12
HTML Question

Javascript detect if html elements fit screen

Is there a way to use javascript to detect if html content can't fit the screen (is scrollable) to show a "back to top button" only if necessary?

Answer

If you're happy to use jQuery, you could try finding the window height and comparing it to a wrapper element height. If the element height is greater, show the button.

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>