给你的博客增加一个随页面滚动漂浮的快捷导航

流年

管理员

320
文章

408千
浏览

评论1,2371字数 296阅读0分59秒

图片

给你的博客增加一个随页面滚动漂浮的快捷导航

添加到页头或者页尾即可。

<div class="rightNav"><a style="right: -110px;" href="#><em>流</em>申请链接</a>
<a style="right: -110px;" href="#"><em>年</em>给我投稿</a>
<a style="right: -110px;" href="#"><em>哔</em>待选菜单</a>
<a style="right: -110px;" href="#"><em>哔</em>待选菜单</a> </div>
<script type="text/javascript">// <![CDATA[
var btb=$(".rightNav"); var tempS; $(".rightNav").hover(function(){ var thisObj = $(this); tempS = setTimeout(function(){ thisObj.find("a").each(function(i){ var tA=$(this); setTimeout(function(){ tA.animate({right:"0"},300);},50*i); }); },200); },function(){ if(tempS){ clearTimeout(tempS); } $(this).find("a").each(function(i){ var tA=$(this); setTimeout(function(){ tA.animate({right:"-110"},300,function(){ });},50*i); }); }); var isIE6 = !!window.ActiveXObject&&!window.XMLHttpRequest; if( isIE6 ){ $(window).scroll(function(){ btb.css("top", $(document).scrollTop()+85) }); }
// ]]></script>

CSS代码

.rightNav{ position:fixed; width:140px; rightright:0; top:105px; _position:absolute; text-align:left; cursor:pointer; background-image:url(about:blank); }
.rightNav a{ display:block; position:relative; height:30px; line-height:30px; margin-bottom:2px; background:#fff; padding-right:10px; width:130px; overflow:hidden; cursor:pointer; rightright:-110px; }
.rightNav a:hover{ text-decoration:none; color:#1974A1; }
.rightNav a:hover em{ background:#00b700}
.rightNav a em{ display:block; float:left; width:30px; background:#1974A1; color:#fff; font-size:16px; text-align:center; margin-right:10px;}