Question

I’ve read various posts about checking if a div has a scrollbar and that bit of my code works. What I need to do is add a class to a div if the scrollbar exists, but without having to write code for each div in question. If I specifically name the divs using the class or ID then the code works, but I need a way of getting it to work using ‘this’.

Here’s my code:

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

$(function(){

if ($('div').hasScrollBar()){
    var scrollObj = $(this);
    scrollObj.addClass('scrollable');
}

});

Answer 1

you could do:

$("div").each(function() {
   if( $(this).hasScrollBar() ) {
      $(this).addClass('scrollable');
   }
});