将类添加到动态高度div

Question

I have a "div#area" with a dynamic contents ,so div height is also dynamic ,what I want is when it's height is greater than 650px add class ".over". I use this script and it's not working:

<script>
    if ($('div#area').height() > 650) {
       $(this).addClass('over');
    }
</script>

Answer 1

this doesn't refers to $('div#area') when you execute the addClass statement. You can store the reference in a variable and use it.

var elem = $('div#area'); //Store a refrence to element
if (elem.height() > 650) {
   elem.addClass('over');
}

Answer 2

Try this

<script>
$(document).ready(function(){
    if ($('#area').height() > 650) {
        $('#area').addClass('over');
    }
})
</script>

Answer 3

<script>
 var area = $('div #area');
 if (area.height() > 650) {
   area.addClass('over');
 }
</script>

Answer 4

<script>
  if ($('#area').height() > 650) {
     $(this).addClass('over');
  }
</script>