How to detect page overflow

Question

I know you can set the overflow property in CSS to determine what the page does on overflow, but I was wondering if there was any way to listen for page overflow using pure javascript or jQuery?

Mr_Green · Accepted Answer · 2013-11-02 16:23:38Z

1

You can check by comparing offsetHeight and scrollHeight

var div = document.getElementById('main');
console.log(div.scrollHeight);
console.log(div.offsetHeight);

The element should have overflow: auto/scroll css property.

Working Fiddle (add content in the div to check)

answered Nov 2, 2013 at 16:23

Mr_Green

42k48 gold badges171 silver badges277 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alex · Accepted Answer · 2013-11-02 16:21:41Z

0

You can do it with jQuery

$("element").css("overflow");

or

$("element").css("overflow-x");

I recommend you the 2nd example, because it should work in most browsers.

answered Nov 2, 2013 at 16:21

Alex

4,8077 gold badges42 silver badges60 bronze badges

1 Comment

Jace Cotton Over a year ago

Wouldn't this just return the value of the overflow property? I want to detect if the page has enough content to where it overflows.

Collectives™ on Stack Overflow

How to detect page overflow

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related