[文章目录]显示/隐藏

看见有人要，就发出来！
大家应该在别人的网站上的侧边栏看见过一个悬浮的小框！
这个框可以放这个网站比较热门的东西，也可以放赞助商广告提升点击率。
我觉得这个功能是非常实用的。
把这代码和使用方法分享出来共同学习交流。

第一步：jQuery代码

 
  1. //sidebar scroll  
  2. jQuery(document).ready(function($) {  
  3.     if (!isie6()) {  
  4.         var offset_height = 0;  
  5.         var rollStart = $('#rollstart'),  
  6.         rollSet = $('.laoshiji');  
  7.         rollStart.before('<div class="laoshijibox"></div>');  
  8.         var offset = rollStart.offset(),  
  9.         objWindow = $(window),  
  10.         rollBox = rollStart.prev();  
  11.         if (objWindow.width() > 960) {  
  12.               
  13.             objWindow.scroll(function() {  
  14.                 if (objWindow.scrollTop() > offset.top+offset_height) {  
  15.                     if (rollBox.html(null)) {  
  16.                         rollSet.clone().prependTo('.laoshijibox');  
  17.                     }  
  18.   
  19.                     if ($(".laoshiji").size()>1)  
  20.                         $(".laoshiji").eq(1).hide();  
  21.                     rollBox.children().show();  
  22.                     rollBox.show().stop().animate({  
  23.                         top: 0,  
  24.                         paddingTop: 15  
  25.                     },  
  26.                     400);  
  27.                 } else {  
  28.                       
  29.                     rollBox.hide().stop().animate({  
  30.                         top: 0  
  31.                     },  
  32.                     400);  
  33.                       
  34.                     if ($(".laoshiji").size()>1)  
  35.                         $(".laoshiji").eq(1).show();  
  36.                 }  
  37.             })  
  38.         }  
  39.     }  
  40.     function isie6() {  
  41.         if ($.browser.msie) {  
  42.             if ($.browser.version == "6.0") return true;  
  43.         }  
  44.         return false;  
  45.     }  
  46. });  

第二步：悬浮框内容标签

 
  1. <div class="laoshiji">这里是悬浮框的添加内容</div>  

第三步：开始滑动位置设置

 
  1. <div id="rollstart"></div>  

第四步：CSS代码

 
  1. .laoshijibox{position:fixed;background:none;width:275px;}  

最后讲解和使用：

由于代码不长懂点儿代码的或许能看懂！
1，在jQuery代码第五行“#rollstart”是指滑块id="rollstart"的容器开始悬浮的位置，一般添加第三步代码到侧边栏的尾部即可。
2，在jQuery代码第六行“.laoshiji”是指要把class="laoshiji"的标签容器进行悬浮。如：第二步代码形式。
3，必不可少的css代码，把第四段代码放在Emlog主题根目录的style.css或者你自己定义的css文件中。
最后：悬浮侧边小工具是非常实用的功能，但是前提发现没？用的是jQuery代码，所以要事先引用一下jQuery库文件吧！Google、Microsoft，Sae，新浪，百度都有开放的jQuery库，可以在Emlog进行外引。