divの高さが300より大きい場合addclassそれ以外の場合は高さが300を超えていない300を削除する

Question

高さが300px以上のときにスクロールバーを追加したいが、高さが300を超えない場合はスクロールが削除される。

あなたは、その高さを確認することで、ダイナミックスクロールバーを追加するためにこれを確認することができ、私

Answer 1

：

チェック：http://jsfiddle.net/reigel/p3FFL/

$(function(){ 
    alert('content 1: ' + $('#my_div1').hasScrollBar()); 
    alert('content 2: ' + $('#my_div2').hasScrollBar()); 
}); 

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

Answer 2

をまたCSSを通してそれに近づくことができます。

はここjsfiddleに例を示します http://jsfiddle.net/justjoe22/nw7noj4h/5/

HTML：

<div id="scroll1"> 
    <ul> 
    <li> 
     <div>I have some text here that is longer than 300px height, but its height is undefined (height can be between 0 and whatever)</div> 
    </li> 
    <li> 
     <div>I have text here less than 300px height</div> 
    </li> 
    </ul> 
</div> 
<div id="scroll2"> 
    <ul> 
    <li> 
     <div>I have some text here that is longer than 300px height, but its height is undefined (height can be between 0 and whatever)</div> 
    </li> 
    <li> 
     <div>I have text here less than 300px height</div> 
    </li> 
    </ul> 
</div> 

CSS：

#scroll1, 
#scroll2 { 
    max-height: 300px; 
    margin-bottom: 100px; 
    overflow: hidden; 
} 

ul { 
    max-height: inherit; 
    list-style-type: none; 
    padding: 0px; 
} 

li { 
    max-height: inherit; 
    overflow: auto; 
} 

li:nth-of-type(even) { 
    background-color: #ddd; 
} 

#scroll1 li div { 
    height: auto; 
} 

#scroll1 li div { 
    height: 400px; 
}