码迷,mamicode.com
首页 > 其他好文 > 详细

滚动条

时间:2016-06-08 12:30:28      阅读:94      评论:0      收藏:0      [点我收藏+]

标签:

<div id="showDiv"> 
  <script type="text/javascript">   
      window.onload=function(){   
var obj=document.getElementById("showDiv");   
if(obj.scrollHeight>obj.clientHeight||obj.offsetHeight>obj.clientHeight){ 
document.getElementById("hiddenDiv").style.height="15pt"; 
  } 
  }   
  </script> 
  <div id="hiddenDiv" style="height:"></div> 
</div>


---------------------
当可视区域小于页面的实际高度时,判定为出现滚动条,即:

if (document.documentElement.clientHeight < document.documentElement.offsetHeight) scroll = true;

要使用 document.documentElement ,必须在页面头部加入声明:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

其实,这段代码是不起作用的,因为他没考虑到一个问题,就是浏览器的边框,当我们在获取页面的offsetHeight高度时是包括了浏览器的边框的,浏览器的边框是2个像素,所以这时无论在任何情况下clientHeight 始终是小于offsetHeight的,这就使得即使没有滚动条它也为true,因此我们要修正这个错误,代码应该这样改,在offsetHeight上减去4个像素,即:

if (document.documentElement.clientHeight < document.documentElement.offsetHeight-4){

//执行相关脚本。

}

还有,这里要搞清楚,上面这代码是判断横向滚动条的,我们一般要判断的是纵向滚动,代码如下:

 

if (document.documentElement.clientWidth < document.documentElement.offsetWidth-4){

//执行相关脚本。

 

滚动条

标签:

原文地址:http://www.cnblogs.com/webgg/p/5569613.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!