gestion de barre de défilement d'un 'div' avec javascript ou jquery

Question

Existe-t-il un moyen de contrôler la durée de vie d'une barre de défilement en fonction de la taille du navigateur et de la taille 'div' en javascript ou jquery. Par exemple, si le contenu « div » déborde puis ajoutez la barre de défilement à div et si le navigateur est redimensionnée à une hauteur supérieure puis retirez la barre de défilement de div, car il va être tendu avec le navigateur:

$("#wrapper").height($(window).height() - 215); 

var elem = document.getElementById("topPanel"); 
var errHolder = document.getElementById("error"); 

if(elem.scrollHeight > elem.clientHeight - errHolder.scrollHeight){ 
    $(elem).css({ 
       "overflow-y": "auto", 
       "overflow-x": "hidden", 
       height: elem.scrollHeight - errHolder.scrollHeight 
       }); 
} 

$(window).resize(function(e){ 
    if(this.clientHeight > 200){ 
     $(elem).css({ 
        "overflow-y": "auto", 
        "overflow-x": "hidden", 
        height: "200px" 
        }); 
    } 
    else { 
     $(elem).css({ 
       "overflow-y": "auto", 
       "overflow-x": "hidden", 
       height: elem.scrollHeight - errHolder.scrollHeight 
       }); 
    } 
}); 

CSS:

#toolPanel { 
position: relative; 
width: 100%; 
height: 100%; 
} 

#topPanel { 
overflow: auto; 
height: 315px; 
width: 100%; 
background: #069; 
border: 1px solid #0CC; 
} 

#bottomPanel { 
position: absolute; 
background: #0CC; 
border: 1px solid #069; 
height: 65px; 
width: 100%; 
bottom: 0; 
} 

HTML:

<div id="wrapper"> 
    <div id="toolPanel"> 
    <div id="error"></div> 
    <div id="topPanel"> 
     <!-- Content that may overflow --> 
    </div> 
    <div id="bottomPanel">&nbsp;</div> 
    </div> 
</div> 

Ceci est juste un bon départ mais je suis perdu ... Je ne suis pas bon avec l'utilisation de clientHeight/défilement, offset, etc. S'il vous plaît aider .

Answer 1

Vous pouvez le faire avec css:

overflow-y: auto;