首页 > Web开发 > 详细

html 滚动固定显示js脚本

时间:2014-04-16 16:28:10      阅读:542      评论:0      收藏:0      [点我收藏+]

<script type="text/javascript">
function htmlScroll()
{
var top = document.body.scrollTop || document.documentElement.scrollTop;
if(elFix.data_top < top)
{
elFix.style.position = ‘fixed‘;
elFix.style.top = 0;
elFix.style.left = elFix.data_left;
}
else
{
elFix.style.position = ‘static‘;
}
}

function htmlPosition(obj)
{
var o = obj;
var t = o.offsetTop;
var l = o.offsetLeft;
while(o = o.offsetParent)
{
t += o.offsetTop;
l += o.offsetLeft;
}
obj.data_top = t;
obj.data_left = l;
}

var oldHtmlWidth = document.documentElement.offsetWidth;
window.onresize = function(){
var newHtmlWidth = document.documentElement.offsetWidth;
if(oldHtmlWidth == newHtmlWidth)
{
return;
}
oldHtmlWidth = newHtmlWidth;
elFix.style.position = ‘static‘;
htmlPosition(elFix);
htmlScroll();
}
window.onscroll = htmlScroll;

var elFix = document.getElementById(‘div1‘);
htmlPosition(elFix);

</script>

以上就是固定显示的一下记录

html 滚动固定显示js脚本,布布扣,bubuko.com

html 滚动固定显示js脚本

原文:http://www.cnblogs.com/rongfengliang/p/3666674.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!