web-dev-qa-db-de.com

Erkennen einer Bildlaufleiste in einem DIV mithilfe von jQuery?

Ich möchte mithilfe von jQuery das Vorhandensein einer Bildlaufleiste in einem DIV erkennen. Ich dachte, $('div').scrollTop() zu verwenden, aber das gibt in beiden Fällen 0 zurück, wenn sich die Bildlaufleiste oben befindet und wenn es überhaupt keine Bildlaufleiste gibt.

Irgendwelche Ideen Jungs?

javascriptjqueryscrollbar
22
7wp

Angenommen, overflow für das div ist 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);

beispiel:

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

Am Ende fand ich eine Lösung, indem ich Folgendes tat:

Wickeln Sie den wachsenden Inhalt mit einem DIV um. Dann erkenne ich, ob eine (vertikale) Bildlaufleiste vorhanden ist, indem Sie die Höhe von wrapperDiv mit der Höhe von containerDiv vergleichen.

Wenn die Höhe von wrapperDiv größer ist als die Höhe von containerDiv, dann gibt es eine Bildlaufleiste. Wenn sie kleiner ist, gibt es keine Bildlaufleiste.

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

Ich werde das, was oben erwähnt wurde, überarbeiten, da Sie nach jQuery fragen

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

Dies liegt daran, dass scrollHeight und scrollWidth DOM-Eigenschaften sind.

0
Musikero31