detectar si el DIV han barra de desplazamiento o no

Question

Duplicar posibles:
Detecting presence of a scroll bar in a DIV using jQuery?

Hay marcado como abajo,

<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> 

Si el contenido tiene barra de desplazamiento, a continuación, debería agregarle clase a ese div como "scroll-image".

La altura puede ser diferente para los DIV. Cualquier solución jQuery para esto.

Answer 1

(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.. 

Tomado de How can I check if a scrollbar is visible?

Answer 2

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

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

Fuente: How can I check if a scrollbar is visible?

Answer 3

Como esailija dijo, duplicado de: Detecting presence of a scroll bar in a DIV using jQuery?

La solución no era la siguiente

var div= document.getElementById('something'); // need real DOM Node, not jQuery wrapper 
var hasVerticalScrollbar= div.scrollHeight>div.clientHeight; 
var hasHorizontalScrollbar= div.scrollWidth>div.clientWidth; 

Answer 4

Es necesario comparar scrollHeight con height del elemento de la siguiente manera:

$('.content').each(function(){ 
    if ($(this)[0].scrollHeight > $(this).height()) { 
    $(this).addClass('scroll-image'); 
    } 
});