如何在浏览器中调整div max-height并打开并重新初始化 [英] How to adjust div max-height on browser open and reinitialize

问题描述

好吧，我有一个div类内容，只要浏览器调整到800px的高度，内容div就会将其最大高度调整为500px。我遇到的问题是，如果浏览器以800px的高度打开，那么除非我刷新浏览器，否则没有滚动条的div。

我拥有的代码：

 < script type =text / javascript> $（$ this）.height（）<= 800）{
 $（'。content'）
 $（window）.on（'resize'，function（）{
 .css（'max-height'，'500px'）; //设置最大高度
} else {
 $（'。content'）。css（'max-height'，''）; //删除属性
} 
}）; 
< / script> 
  

另外我使用jScrollPane，如果我在css中设置了max-height，我使用上面的代码来使用常规滚动条。任何帮助都将不胜感激。

解决方案

试试这个：

<$ （）{
$ b $（window）.on（'resize'，function（）{
if（ $（this）.height（）<= 800）{
$（'。content'）。css（'max-height'，'500px'）; //设置最大高度
} else {
$（'。content'）。css（'max-height'，''）;
}
}）。resize（）

}）

Okay I have a div class "content" and whenever the browser resizes to 800px in height the content div resizes its max-height to 500px. The problem I am having is if the browser opens with a height of 800px then there is no scrollbar for the div unless I refresh the browser.

The code I have:

<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>

Also I am using jScrollPane and it works fine if I set the max-height in the css but if I use the code above instead a regular scrollbar is used. Any help on either would be appreciated.

解决方案

Try this:

$(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()

})

这篇关于如何在浏览器中调整div max-height并打开并重新初始化的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！