jQuery实现可关闭固定于底(顶)部的工具条菜单效果

2020-05-29 06:56:39易采站长站整理

<script type="text/javascript">
var closeBN = $.cookie("bnav");
if (closeBN == "0"){closeNav();}
function showNav(){
$(".openClose").toggle();
$.cookie("bnav", "1", {expires: 1});
}
function closeNav(){
$(".openClose").toggle();
$.cookie("bnav", "0", {expires: 1});
}
// 单行滚动
function SingleScroll(){
$(".rolltext dd").animate({marginTop:"-25px"},500,function(){
$(this).css({marginTop:"0px"}).find("a:first").appendTo(this);
});
}
$(document).ready(function(){
setInterval("SingleScroll()",3000);
});
</script>
<div class="bnav openClose">
<div class="bnav2">
<span class="s1">
<a href="#"><img src="images/qqonline.gif"></a><a href="#"><img src="images/qqonline2.gif"></a>
</span>
<dl class="rolltext">
<dt>特别声明:</dt>
<dd>
<a href="#">庆双节期间,商城有专人值班,请上帝们放心购物</a>
<a href="#">天悦所售手机为大陆行货、全国联保商品</a>
<a href="#">部分少量港行、欧行机器我们都已特别注明</a>
<a href="#">请上帝们就不要再咨询同类问题啦,客服电话要爆喽</a>
</dd>
</dl>
<span class="s2">
<span><a href="#">[登录]</a><a href="#">[免费注册]</a></span><a href="#">购物车</a>|<a href="#">帮助中心</a>|<a href="#">在线留言</a>
</span>
<span class="close"><a href="javascript:void(0)" onclick="closeNav()" title="关闭">关闭</a></span>
</div>
</div>
<div class="bnav3 openClose" style="display:none;"><a href="javascript:void(0)" onclick="showNav()" title="打开">打开</a></div>
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。