JavaScript 滚动条示例,控制居中document.documentElement.scrollTop,document.body.scrollTop,oDiv.offsetHeight
2016-06-08 14:16
537 查看
<!doctype html> <html> <head> <meta charset="utf-8"> <title>JavaScript 滚动条示例,控制居中document.documentElement.scrollTop,document.body.scrollTop,oDiv.offsetHeight</title> <style> #div1 { width:100px; height:100px; background-color:#676767; position:absolute; right:0px;} </style> <script> document.onscroll = function(){ var oDiv = document.getElementById('div1'); var scrollTop2 = document.documentElement.scrollTop || document.body.scrollTop; var divT = scrollTop2 + ((document.documentElement.clientHeight - oDiv.offsetHeight)/2); oDiv.style.top = divT + 'px'; } </script> </head> <body style="height:2000px;"> <div id="div1"></div> </body> </html>
相关文章推荐
- JavaScript 三种创建对象的方法
- JavaScript 高级课程之淡出淡入CSS filter等属性
- OC之JSON数据解析
- JavaScript 高级课程之分享setInterval(),clearInterval(),onmouseover,onmouseout应用(2_自动判断正负)
- JavaScript 高级课程之分享setInterval(),clearInterval(),onmouseover,onmouseout应用
- JavaScript 高级课程之定时器setInterval,clearInterval
- JavaScript onmousewheel鼠标滚轮示例
- JavaScript Cookie的使用实例
- javascript 使用btoa和atob来进行Base64转码和解码
- JavaScript Cookie的使用
- JavaScript onmousedown选择元素,onmousemove拖动元素,onmouseup松开鼠标,磁性吸附效果示例
- 使用Jsoup解析html网页
- javascript 执行环境,变量对象,作用域链
- JavaScript oncontextmenu鼠标右键菜单触发 自定义右键菜单示例
- JavaScript onkeydown键盘按下时触发,ev.keyCode按下的键值
- 浅析JSONP技术原理及实现
- JavaScript 冒泡原理及示例
- javascript replaceChild元素替换
- 利用JavaScript 给元素属性赋值
- 利用JavaScript 给元素属性赋值