可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试):
问题:
This question already has an answer here:
I want to detect the presence of a scroll bar in a DIV using jQuery. I was thinking to use $('div').scrollTop()
but that returns 0 in both cases when the scroll bar is at the top and when there is no scroll bar at all.
Any ideas guys?
回答1:
Assuming overflow
on the div is auto
:
var div= document.getElementById('something'); // need real DOM Node, not jQuery wrapper var hasVerticalScrollbar= div.scrollHeight>div.clientHeight; var hasHorizontalScrollbar= div.scrollWidth>div.clientWidth;
回答2:
// plugtrade.com - jQuery detect vertical scrollbar function // (function($) { $.fn.has_scrollbar = function() { var divnode = this.get(0); if(divnode.scrollHeight > divnode.clientHeight) return true; } })(jQuery);
example:
if($('#mydiv').has_scrollbar()) { /* do something */ }
回答3:
I will revise what bobince mentioned above since you are asking for jQuery
var div= $('#something'); var hasVerticalScrollbar= div[0].scrollHeight > div[0].clientHeight; var hasHorizontalScrollbar= div[0].scrollWidth > div[0].clientWidth;
This is because scrollHeight
and scrollWidth
are DOM properties.
回答4:
Well I ended up finding a solution by doing the following:
Wrap the content that grows with a DIV, then I detect if a (vertical) scroll bar is present by comparing the height of wrapperDiv
with the height of containerDiv
(which normally has the scroll bar if the content is too large).
If the height of wrapperDiv
is bigger than the height of containerDiv
then there is a scroll bar, if it is smaller, then there is no scroll bar.