看月光博客，盧松松博客，文章頁的側邊欄都可以隨著瀏覽器滾動而停留在頁面，羨慕了吧。其實我們也可以用這種特效的呢。下面，就講講如何實現這個效果吧~這個是盧松松博客原創的，我稍稍介紹了一下而已哈！
一：這個效果有什么用
現在很多網站都有這種效果，比如月光博客，盧松松博客，當你一篇文章寫的較長，而且評論較多的時候，這個功能就可以幫你提高瀏覽量，用戶在你的博客里面的跳出率也會隨之減少。如果你在這放個廣告，效果會很不錯！
二：如何實現這個功能
親，采用JS+CSS就可以實現這個功能了
三：實現側邊欄跟隨特效的方法
CSS：
/*側欄跟隨*/
#box{float:left; position:relative;width:250px;}.div1{width:250px;}.div2{position:fixed;_position:absolute;top:0;z-index:250;}
如貴站的側邊欄寬度不是250px，請另行修改！
JS：
//側欄跟隨
(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";}
};
}
})();
這段代碼是用于js文件中，然后引用，引用方法是在貴站需要實現這個功能的網頁中如這樣引用：
<script type="text/javascript" src=“http://***.com/wp-content/themes/ihxy/js/util.js”></script>
大功告成！
除非注明，胡小易博客文章均為原創，轉載請以鏈接形式標明本文地址
本文地址：http://huxiaoyi.com/website/20120624.html