欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

后台系统左侧菜单栏自适应屏幕分辨率添加滚动条

程序员文章站 2022-05-24 21:11:33
...

设计网页的过程中,有时需满足不能超出屏幕大小的规则限定,考虑到不停的屏幕有不同的SIZE尺寸。

       这么一来我们就需要让它自己获取screen中的宽高度了。( height width )

 

  情景:

    一般网页内容过多时,右边出现滚动条来进行下滑查看网页内容,当我们一个页面中出现多个模块,页面规定只能显示在

  我们所看屏幕尺寸时(就是不能整体页面滚动),当内容超出时,我们可以设置部分相关的页面模块进行滚动条滑动。

      类似于我们在一个一面中使用到了iframe时,按需求我们只能讲内容显示在iframe中,切不超出当前的页面大小,则

  需要我们使用此方法。

 

使用 js 来完成这一方法:

 

  后台系统左侧菜单栏自适应屏幕分辨率添加滚动条

/*使用JavaScript来实现*/
 
var  menuHeight = document.getElementById('menu');
 
var  screenHeight = window.innerHeight  //浏览器窗口的内部高度
/* var  screenHeight =  document.documentElement.clientHeight; */
menuHeight.style.height=screenHeight-80+"px";
 
 
/*使用jQuery来实现*/
 
/****方法一****/
$('.menu').height($(window).height()-80);
 
 /****方法二****/
$('.menu').css("height",$(window).height()-80);