detect elements overflow using jquery

Question

CSS:

 .blue     {      width:200px;      height:200px;      background-color:blue;      color:#000000;      overflow:auto;     } 

JavaScript:

function addChar() {     $('.blue').append('some text  '); } 

HTML:

<div id='blue1' class="blue"></div><br /> <a href='javascript:void(0)' onclick='addChar()'>Add</a> 

div id='blue1' has overflow property set to auto. I want to detect overflow when it happens.

Answer 1

$.fn.HasScrollBar = function() {     //note: clientHeight= height of holder     //scrollHeight= we have content till this height     var _elm = $(this)[0];     var _hasScrollBar = false;      if ((_elm.clientHeight < _elm.scrollHeight) || (_elm.clientWidth < _elm.scrollWidth)) {         _hasScrollBar = true;     }     return _hasScrollBar; } 

/// this is my solution