JavaScript智能浮动

申请免费试用、咨询电话：400-8352-114

我们经常在淘宝网看到这样的特效，商品列表特别长，而商品列称号一直坚持在最顶端。假如你把滚动条滚动至最上边了，那么它会自动判别能否到顶端了，然后不断置顶从而不怕遮挡。

这种特效是经过JavaScript和CSS完成的，在实践开发中有不少用处，下面是新余网站建设找到的一个运用JavaScript制造的仿淘宝智能浮动的源代码，兼容性不错，在IE、Firefox、Chrome下都能正常工作。

在Z-Blog中运用这个特效代码需求留意，假如在侧边栏运用，则需求留意，侧栏中的栏目不能运用JavaScript动态加载，必需用静态的格式，否则在JavaScript会错误的计算页面高度，上下滚动的时分会呈现错位现象。

以下是相关代码：

JavaScript 代码

(function(){

var oDiv=document.getElementById("float");

var H=0,iE6;

var Y=oDiv;

while(Y){H+=Y.offsetTop;Y=Y.offsetParent};

iE6=window.ActiveXObject&&!window.XMLHttpRequest;

if(!iE6){

window.onscroll=function()

{

var s=document.body.scrollTop||document.documentElement.scrollTop;

if(s>H){oDiv.className="div1 div2";if(iE6){oDiv.style.top=(s-H)+"px";}}

else{oDiv.className="div1";}

};

}

})();