读书人

用JS模拟一个fixed的效果但是ie和ch

发布时间: 2012-04-10 21:03:56 作者: rapoo

用JS模拟一个fixed的效果,但是ie和chrome下闪厉害,求解决办法
注意:这个效不是相对于浏览器定位的,box元素始终相对父级定位,当拖动滚动条的时候,固定在一个位置不动。

请教大家一些,有什么方法可以解决闪动的问题~~就让他相对父级死死的定位在一个地方就就行了~~


HTML code
<!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-Type" content="text/html; charset=gb2312" /><title>无标题文档</title><style type="text/css">    *{ margin:0; padding:0;}    body{ background:#CCC;}    .wrapper{ position:relative; width:500px; height:500px; background:#FFF;}    .box{ position:absolute; top:10px; right:20px; width:150px; height:100px; background:green;}</style><script type="text/javascript">window.onload=function(){        var box=document.getElementById('box');        window.onscroll=function(){                var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;        document.title=scrollTop;        box.style.top=(scrollTop+10)+'px';    }};</script></head><body style="height:3000px;"><div class="wrapper">    <div class="box" id="box"></div></div></body></html>


[解决办法]
闪是不可避免的
.wrapper{position:fixed !important;position: relative;}
加个这个!important

读书人网 >JavaScript

热点推荐