Metro扁平风格网页右侧返回顶部特效代码如下：
<!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=gb2312" />
<meta name="keywords" content="JS代码,在线客服,JS广告代码,JS特效代码" />
<meta name="description" content="此代码内容为Metro扁平风格网页右侧返回顶部代码，属于站长常用代码，更多在线客服代码请访问六久阁JS代码频道。" />
<title>Metro扁平风格网页右侧返回顶部代码_六久阁</title>
<link href="css/lrtk.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
</head>
<body style="height:5000px">
<!-- 代码 开始 -->
<div id="leftsead">
<ul>
<li><a href="http://www.lol9.cn/" target="_blank"><img src="images/ll01.png" width="131" height="49" class="hides"/><img src="images/l01.png" width="47" height="49" class="shows" /></a></li>
<li><a href="http://www.lol9.cn/" target="_blank"><img src="images/ll03.png" width="131" height="49" class="hides"/><img src="images/l03.png" width="47" height="49" class="shows" /></a></li>
<li><a class="youhui"><img src="images/l02.png" width="47" height="49" class="shows" /><img src="images/youhui.png" width="145" height="343" class="hides" usemap="#taklhtml"/><map name="taklhtml"><area shape="rect" coords="26,273,115,300 " href="http://www.lol9.cn/" /></map></a></li>
<li><a href="tencent://message/?uin=987654321&Site=www.ke01.com&Menu=yes"><img src="images/ll04.png" width="131" height="49" class="hides"/><img src="images/l04.png" width="47" height="49" class="shows"/></a></li>
<li><a href="http://www.lol9.cn/" target="_blank"><img src="images/ll05.png" width="131" height="49" class="hides"/><img src="images/l05.png" width="47" height="49" class="shows" /></a></li>
<li><a id="top_btn"><img src="images/ll06.png" width="131" height="49" class="hides"/><img src="images/l06.png" width="47" height="49" class="shows" /></a></li>
</ul>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#leftsead a").hover(function(){
if($(this).prop("className")=="youhui"){
$(this).children("img.hides").show();
}else{
$(this).children("img.hides").show();
$(this).children("img.shows").hide();
$(this).children("img.hides").animate({marginRight:'0px'},'slow');
}
},function(){
if($(this).prop("className")=="youhui"){
$(this).children("img.hides").hide('slow');
}else{
$(this).children("img.hides").animate({marginRight:'-143px'},'slow',function(){$(this).hide();$(this).next("img.shows").show();});
}
});
$("#top_btn").click(function(){if(scroll=="off") return;$("html,body").animate({scrollTop: 0}, 300);});
});
</script>
<!-- 代码 结束 -->
<div style="text-align:center;margin:50px 0">
<p>来源：<a href="http://www.lol9.cn/" target="_blank">六久阁</a> 代码整理：<a href="http://www.lol9.cn/" target="_blank">六久阁</a>
- 全部评论（0）
