JS判断是否出现滚动条

http://www.cnblogs.com/yazdao/archive/2010/12/06/1897742.html

该博文是想用JS检测浏览器是否出滚动条。

这边想到一个比较取巧的方法,

假如没有出滚动条的时候,手工给增加一个滚动值会怎么样?

程序上就是给body或documentElement的scrollLeft、scrollTop赋值,

马上动手实现了一下,结果跟我意想的差不多,呵呵

浏览器在没有出滚动条的时候,赋值后该值不会发生变化,始终是0。

另外扩展了一下,该检测方法,不仅可以检测页面滚动条,

传入要检测的节点,一样可以得到想要的结果。

以下是我的实现,没有做太多异常处理:

(给scrollLeft,scrollTop赋负数值时会报错,此外scrollLeft,scrollTop的值不能大于实际最大的滚动值)

var isScroll = function (el) {
             // test targets
             var elems = el ? [el] : [document.documentElement, document.body];
             var scrollX = false, scrollY = false;
             for (var i = 0; i < elems.length; i++) {
                 var o = elems[i];
                 // test horizontal
                 var sl = o.scrollLeft;
                 o.scrollLeft += (sl > 0) ? -1 : 1;
                 o.scrollLeft !== sl && (scrollX = scrollX || true);
                 o.scrollLeft = sl;
                 // test vertical
                 var st = o.scrollTop;
                 o.scrollTop += (st > 0) ? -1 : 1;
                 o.scrollTop !== st && (scrollY = scrollY || true);
                 o.scrollTop = st;
             }
             // ret
             return {
                 scrollX: scrollX,
                 scrollY: scrollY
             };
         };出自于:http://my.oschina.net/oncereply/blog/38511

  

时间: 2024-10-11 00:28:47

JS判断是否出现滚动条的相关文章

JS判断页面是否出现滚动条

今天无聊,帮一个网友解决一个很无聊的问题,用JS判断页面是否出现滚动条,在网上看了一些代码,经过验证并不起作用,下面是在网上搜索到的代码: 当可视区域小于页面的实际高度时,判定为出现滚动条,即: if (document.documentElement.clientHeight < document.documentElement.offsetHeight) scroll = true; 要使用 document.documentElement ,必须在页面头部加入声明: <!DOCTYPE

IE,火狐,谷歌浏览器下js判断滚动条是否已拉到页面最底部

E/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否已拉到页面最底部 DTD已声明 IEdocument.documentElement.scrollHeight  浏览器所有内容高度 ,document.body.scrollHeight  浏览器所有内容高度document.documentElement.scrollTop  浏览器滚动部分高度,do

原生js判断某个区域的滚动条滚动到了底部

原生js判断某个区域的滚动条滚动到了底部 讲解==> 关系公式:element.scrollHeight - element.scrollTop === element.clientHeight 解释:此公式可以用于判断是否滚动到底 你必须知道这个方法 可以判断滚动条滚动到了底部哈! element.scrollHeight 是获取这个元素区域的实际高度(包含被隐藏起来的高度) element.scrollTop是获取滚动条距离顶部的实际距离(包含被隐藏起来的高度) element.client

js判断浏览器类型

js判断浏览器类型  <script type="text/javascript" >     <!--   function getOs()   {       var OsObject = "";      if(isIE = navigator.userAgent.indexOf("MSIE")!=-1) {           return "MSIE";      }      if(isFiref

js 判断一个文本框是否获得焦点

1.js 判断一个文本框是否获得焦点 // 可以用document.activeElement判断 // document.activeElement表示当前活动的元素 // 查找你要判断的文本框 var myInput = document.getElementById('myInput'); if (myInput == document.activeElement) {     alert('获取焦点'); } else {     alert('未获取焦点'); } 2.文本框获取焦点后

js判断NaN

NaN是什么? not a nunber //不是数字 js判断NaN?不是有isNaN?标准的函数库isNaN不可靠的. isNaN(NaN);//true  这很正常 isNaN("张为是最帅的");//true  这TM还正常吗? isNaN({});//true  这TM还正常吗? 还好NaN是Javascript中唯一一个不等于本身的值,呵呵,写个自定义函数来判断它是不是NaN. 1 //判断是不是NaN--not a number 2 function isReallyNa

Js获取当前日期时间+日期印证+判断闰年+日期的天数差+日期格式化+JS判断某年某月有多少天

Js获取当前日期时间+日期验证+判断闰年+日期的天数差+日期格式化+JS判断某年某月有多少天 字符串转日期型+Js当前日期时间+日期验证+判断闰年+日期的天数差+日期格式化+日期所在年的第几周 日期时间脚本库方法列表Date.prototype.isLeapYear 判断闰年Date.prototype.Format 日期格式化Date.prototype.DateAdd 日期计算Date.prototype.DateDiff 比较日期差Date.prototype.toString 日期转字符

js判断是否为空

http://dushanggaolou.iteye.com/blog/1293803 1.<input type="hidden" id="key" name="key" value="123"> 用js判断隐藏域的值是否为空, 方法一: Java代码   var keyVal= $("#key").val(); if(keyVal==undefined || keyVal=="&q

js判断上传文件大小

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="content-typ