摘要:1、对内容区域滚动条滚动的监听:要放在内容加载的时候2、获取整个内容区域的滚动高度:

小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。

JQ滚动条事件

1、对内容区域滚动条滚动的监听:要放在内容加载的时候

 $("#conten").on("scoll",function(){  console.log("滚动了"); })

2、获取整个内容区域的滚动高度:

   $("#content").get(0).scrollHeight

3、区域可见高度

 $("#content").height()

4、当前滚动的地方的窗口顶端到整个内容顶端的距离:

   var scollH = $("#content").scrollTop();

5、让滚动条默认在最底下

 $('#content').scrollTop( $('#content')[0].scrollHeight );

附上其余获取各种高度的代码

 在IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 在FireFox中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度  在Opera中:  document.body.clientWidth ==> 可见区域宽度 document.body.clientHeight ==> 可见区域高度 document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽) document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) 而如果没有定义W3C的标准,则 IE为: document.documentElement.clientWidth ==> 0 document.documentElement.clientHeight ==> 0 FireFox为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) Opera为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)      网页可见区域宽: document.body.clientWidth  网页可见区域高: document.body.clientHeight   网页可见区域宽: document.body.offsetWidth(包括边线的宽)   网页可见区域高: document.body.offsetHeight(包括边线的宽)   网页正文全文宽: document.body.scrollWidth   网页正文全文高: document.body.scrollHeight   网页被卷去的高: document.body.scrollTop   网页被卷去的左: document.body.scrollLeft   网页正文部分上: window.screenTop   网页正文部分左: window.screenLeft   屏幕分辨率的高: window.screen.height   屏幕分辨率的宽: window.screen.width   屏幕可用工作区高度: window.screen.availHeight   屏幕可用工作区宽度: window.screen.availWidth 

JQ滚动条事件

1、对内容区域滚动条滚动的监听:要放在内容加载的时候

 $("#conten").on("scoll",function(){  console.log("滚动了"); })

2、获取整个内容区域的滚动高度:

   $("#content").get(0).scrollHeight

3、区域可见高度

 $("#content").height()

4、当前滚动的地方的窗口顶端到整个内容顶端的距离:

   var scollH = $("#content").scrollTop();

5、让滚动条默认在最底下

 $('#content').scrollTop( $('#content')[0].scrollHeight );

附上其余获取各种高度的代码

 在IE中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度 在FireFox中: document.body.clientWidth ==> BODY对象宽度 document.body.clientHeight ==> BODY对象高度 document.documentElement.clientWidth ==> 可见区域宽度 document.documentElement.clientHeight ==> 可见区域高度  在Opera中:  document.body.clientWidth ==> 可见区域宽度 document.body.clientHeight ==> 可见区域高度 document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽) document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) 而如果没有定义W3C的标准,则 IE为: document.documentElement.clientWidth ==> 0 document.documentElement.clientHeight ==> 0 FireFox为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高) Opera为: document.documentElement.clientWidth ==> 页面对象宽度(即BODY对象宽度加上Margin宽)document.documentElement.clientHeight ==> 页面对象高度(即BODY对象高度加上Margin高)      网页可见区域宽: document.body.clientWidth  网页可见区域高: document.body.clientHeight   网页可见区域宽: document.body.offsetWidth(包括边线的宽)   网页可见区域高: document.body.offsetHeight(包括边线的宽)   网页正文全文宽: document.body.scrollWidth   网页正文全文高: document.body.scrollHeight   网页被卷去的高: document.body.scrollTop   网页被卷去的左: document.body.scrollLeft   网页正文部分上: window.screenTop   网页正文部分左: window.screenLeft   屏幕分辨率的高: window.screen.height   屏幕分辨率的宽: window.screen.width   屏幕可用工作区高度: window.screen.availHeight   屏幕可用工作区宽度: window.screen.availWidth 

觉得可用,就经常来吧!Javascript技巧 脚本宝典 欢迎评论哦! js技巧,巧夺天工,精雕玉琢。小宝典献丑了!

本文固定链接: http://www.js-code.com/js/js_1329.html