Erkennen der Anwesenheit einer Bildlaufleiste in einem DIV mit jQuery?

Ich möchte das Vorhandensein einer Bildlaufleiste in einem DIV mit jQuery erkennen. Ich dachte, $('div').scrollTop() zu verwenden, aber das gibt 0 in beiden Fällen zurück, wenn die Bildlaufleiste an der Spitze ist und wenn überhaupt keine Bildlaufleiste ist.Erkennen der Anwesenheit einer Bildlaufleiste in einem DIV mit jQuery?

Irgendwelche Ideen Leute?

Quelle

2010-04-15 7wp

siehe http://stackoverflow.com/questions/2571514/is-detecting-scrollbar-presence-with-jquery-still-difficult –

oder http://stackoverflow.com/questions/2059743/detect-elements-overflow -using-jquery –

@moi_meme +1 Ich suchte nach dieser Frage, um hier zu posten: p – fmsf

overflow auf dem div Unter der Annahme 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;

Quelle

2010-04-15 18:41:51 bobince

Das funktioniert auch. Vielen Dank. Aber anders als in meinem Lösungsbeispiel habe ich gepostet: In der realen Welt habe ich keine "IDs", mit denen ich arbeite, ich wähle den DIV mit jQuery CSS Selektoren ... – 7wp

+10

Dann benutze 'jQueryElement.get (0)' um zu bekommen der reale DOM-Knoten von ihm http://api.jquery.com/get. – BalusC

Während dies wirklich nützlich ist, ist es wirklich die richtige Antwort, da es überhaupt keine jQuery verwendet? –

-1

Nun landete ich eine Lösung zu finden, indem Sie folgendermaßen vorgehen:

Wickeln Sie den Inhalt, die mit einem DIV wächst, dann, wenn ein I erkennen (vertikale) Bildlaufleiste vorhanden ist, indem die Höhe von wrapperDiv mit der Höhe von containerDiv verglichen wird (die normalerweise die Bildlaufleiste hat, wenn der Inhalt zu groß ist).

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

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

Quelle

2010-04-15 18:46:46 7wp

Haben Sie die Lösung von bobince versucht? Es scheint, als würde es ohne die zusätzliche Wrapper div funktionieren. –

war das nicht die Antwort vom zweiten Link, den ich gepostet habe? http://StackOverflow.com/Questions/2059743/detect-Elements-Overflow-using-Jquery –

Ja bobince Lösung würde funktionieren, aber im Gegensatz zu dem oben genannten Beispiel habe ich nicht wirklich "IDs" zu arbeiten. Ich wähle mit jQuery CSS-Selektoren aus, sodass ich getElementById nicht verwenden kann, um auf clientHeight() zuzugreifen. Außerdem traue ich dem rohen .clientHeight-Wert nicht zu, da ich denke, dass er in verschiedenen Browsern leicht unterschiedliche Zahlen zurückgibt, oder? – 7wp

// 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 */ }

Quelle

2012-01-23 12:36:32

Große Lösung im Vergleich zu den vielen anderen Beispielen/Versuchen, dieses Problem anzugehen. Ich habe bestätigt, dass dies auf IE, FF und Chrome funktioniert. – carrabino

Ich werde revidieren, was oben erwähnt bobince, da Sie für jQuery fragen

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

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

Quelle

2016-06-01 09:47:24 Musikero31

Erkennen der Anwesenheit einer Bildlaufleiste in einem DIV mit jQuery?

Antwort

Verwandte Themen