jquery右侧浮动，右侧客服浮动代码_中国网站频道，官方网站，中国品牌网站，网页特效，JS广告，网站截图，酷站推荐，图标，APP，按钮，中国网站第一品牌频道网站频道，div css，flash广告代码，网页特效，png图片，后台模板，flash特效，软件下载，中文字体下载，英文字体下载，

> 代码 > 菜单

jquery右侧浮动，右侧客服浮动代码

作者：vip_260 来源：日期：2014/3/20 17:07:44 人气：标签：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery右侧边固定层导航菜单依次动画滑动显示菜单展开</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;text-decoration:none;}
body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";background:#DCDCDC;}
/* rightNav */
.rightNav{position:fixed;top:0;right:0;z-index:9999;width:140px;cursor:pointer;margin:100px 0 0 0;}
*html,*html body /* 修正IE6振动bug */{background-image:url(about:blank);background-attachment:fixed;}
*html .rightNav{position:absolute;top:expression(eval(document.documentElement.scrollTop));}
.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;right:-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;font-style:normal;}
</style>

</head>
<body>

<div class="rightNav">
	<a href="http://www.v404.cn/"><em>0</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>1</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>2</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>3</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>4</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>5</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>6</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>7</em>网站频道</a>
    <a href="http://www.v404.cn/"><em>8</em>网站频道</a>
</div>
<script type="text/javascript">
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);
	});
});
</script>

<div style="height:2000px;"></div>

</body>
</html>

提示：复制和保存代码功能在FF下无效。

公告

更新

> 代码 > 菜单

jquery右侧浮动，右侧客服浮动代码