首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

透过js与css控制某一块div能随着窗口而移动

2013-07-16 
通过js与css控制某一块div能随着窗口而移动?红色标注的领域需要随着窗口的移动而移动,如何控制呢?需要需要

通过js与css控制某一块div能随着窗口而移动

?红色标注的领域需要随着窗口的移动而移动,如何控制呢?
需要需要设定该区域的css属性:

该div需要有一个唯一id:?layout-lt

.guding{background:url(../images/knj_img/knj_19.jpg) repeat-x; height:80px;zoom:1; clear:both;position:fixed;_position:absolute;margin-left:196px;}

?

然后需要js来控制:

<script>(function(){var win_h=document.documentElement.clientHeight;document.getElementById('layout-lt').style.top=win_h-80+'px';   //46为底部抓潜的高度;窗口的高度-底部抓潜的高度var ua = navigator.userAgent.toLowerCase(),  //IE6浏览器上下流动缓冲IE = !-[1,],isIE = /ie/.test( ua ),isIE6 = isIE && /msie 6/.test( ua );function addEvent(obj, eventName,func){    if (obj.addEventListener) {        obj.addEventListener(eventName,func, false);    } else if (obj.attachEvent) {        obj.attachEvent("on" + eventName,func);    }}var fun = function(){var oDiv_lt = document.getElementById('layout-lt');setLayout(oDiv_lt);}if(isIE6){addEvent(window,'scroll',fun);//触发滚动事件,调用fun方法window.onload = fun;}function setLayout(obj){if(!obj) return false; var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;var iTaget = parseInt(scrollTop+document.documentElement.clientHeight-obj.offsetHeight);startMove(obj,iTaget);}function startMove(objEle,iTaget){clearInterval(objEle.timeId);objEle.timeId = setInterval(function(){var iSpeed = (iTaget-objEle.offsetTop)/8;iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed);if(objEle.offsetTop == iTaget){clearInterval(objEle.timeId);}else{objEle.style.top=objEle.offsetTop+iSpeed+'px';}},30)}})()<!--底部抓潜JS控制--end--></script>

?

这样就可以啦!

?

ps:

http://shop103421648.taobao.com/index.htm?spm=2013.1.w5002-1469269095.2.oOp4Qw

请大家支持一下苦逼程序员的淘宝!

热点排行