9

重複の可能性:
jQuery を使用して DIV 内のスクロール バーの存在を検出していますか?

以下のようなマークアップがあり、

<div class="content">Lorem</div>
<div class="content">Lorem Iorem Lorem Iorem Lorem Iorem Lorem Iorem Lorem IoremLorem Iorem Lorem Iorem Lorem Iorem</div>
<div class="content">Lorem</div>
<div class="content">Lorem</div>

コンテンツにスクロール バーがある場合は、"scroll-image" のようにその div にクラスを追加する必要があります。

DIV の高さは異なる場合があります。このための任意の jQuery ソリューション。

4

4 に答える 4

34 
(function($) {
    $.fn.hasScrollBar = function() {
        return this.get(0).scrollHeight > this.height();
    }
})(jQuery);

$('#my_div1').hasScrollBar(); // returns true if there's a `vertical` scrollbar, false otherwise..

スクロールバーが表示されているかどうかを確認するにはどうすればよいですか?から取得

于 2012-06-08T11:35:49.330 に答える
5

次のような要素と比較scrollHeightする必要があります。height

$('.content').each(function(){
  if ($(this)[0].scrollHeight > $(this).height()) {
    $(this).addClass('scroll-image');
  }
});
于 2012-06-08T11:37:17.603 に答える
2

esailija が言ったように、複製: jQuery を使用して DIV 内のスクロール バーの存在を検出していますか?

そこでの解決策は次のとおりでした

var div= document.getElementById('something'); // need real DOM Node, not jQuery wrapper
var hasVerticalScrollbar= div.scrollHeight>div.clientHeight;
var hasHorizontalScrollbar= div.scrollWidth>div.clientWidth;
于 2012-06-08T11:36:28.930 に答える
0 
(function($) {
$.fn.hasScrollBar = function() {
    return this.get(0).scrollHeight > this.height();
}
})(jQuery);

$('div').hasScrollBar(); //return true if it has one

ソース:スクロールバーが表示されているかどうかを確認するにはどうすればよいですか?

于 2012-06-08T11:35:50.040 に答える