it-swarm.com.ru

Обнаруживаете наличие полосы прокрутки в DIV, используя jQuery?

Я хочу обнаружить наличие полосы прокрутки в DIV с помощью jQuery. Я думал использовать $('div').scrollTop(), но это возвращает 0 в обоих случаях, когда полоса прокрутки находится сверху и когда полоса прокрутки вообще отсутствует.

Есть идеи, ребята?

22
7wp

Предполагая, что overflow в div является 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;
46
bobince
// 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);

пример:

if($('#mydiv').has_scrollbar()) { /* do something */ } 
18
PlugTrade.com

В итоге я нашел решение, сделав следующее:

Оберните содержимое, которое увеличивается с помощью DIV, затем я определяю, присутствует ли (вертикальная) полоса прокрутки, сравнивая высоту wrapperDiv с высотой containerDiv (которая обычно имеет полосу прокрутки, если содержимое слишком велико).

Если высота wrapperDiv больше высоты containerDiv, то есть полоса прокрутки, если она меньше, то полосы прокрутки нет.

<DIV id="containerDiv" style="width:100px;height:100px;overflow:auto;">
    <DIV id="wrapperDiv">
        .... content here...
    </DIV>
</DIV>
0
7wp

Я пересмотрю то, что bobince упомянул выше, так как вы просите JQuery

var div= $('#something');
var hasVerticalScrollbar= div[0].scrollHeight > div[0].clientHeight;
var hasHorizontalScrollbar= div[0].scrollWidth > div[0].clientWidth;

Это потому, что scrollHeight и scrollWidth являются свойствами DOM.

0
Musikero31