如何在浏览器打开时调整div max-height并重新初始化

Question

好吧,我有一个div类"内容",每当浏览器调整到800px的高度时,内容div将其最大高度调整为500px.我遇到的问题是如果浏览器打开的高度为800px,那么除非我刷新浏览器,否则div没有滚动条.

我的代码:

<script type="text/javascript">
$(window).on('resize', function(){
if($(this).height() <= 800){
    $('.content').css('max-height', '500px'); //set max height
}else{
    $('.content').css('max-height', ''); //delete attribute
}
});
</script>

另外我使用jScrollPane,如果我在css中设置max-height,它可以正常工作,但如果我使用上面的代码,则使用常规滚动条.对任何一方的任何帮助将不胜感激.

Answer 1

试试这个:

$(document).ready(function() {

   $(window).on('resize', function(){
     if ($(this).height() <= 800){
          $('.content').css('max-height', '500px'); //set max height
     } else{
          $('.content').css('max-height', ''); 
     }
   }).resize()

})