您的位置：首页 > Web前端 > JQuery

jQuery固定DIV实现“返回顶部”

2012-10-05 01:06 561 查看

<!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>
<title>jQuery实现“返回顶部”（固定DIV） - 计划 - 博客园</title>
<meta name="keywords" content="www.cnblogs.com/jihua"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<div style=" background-color:Green; width:100%;height:150px;">jihua.cnblogs.com</div>
<div style=" background-color:Red; width:100%;height:150px;">欢迎</div>
<div style=" background-color:Yellow; width:100%;height:150px;">hi</div>
<div style=" background-color:Silver; width:100%;height:150px;">计划</div>
<div style=" background-color:Aqua; width:100%;height:150px;">博客园</div>
<div style=" background-color:Fuchsia; width:100%;height:150px;">jihua</div>
<div style=" background-color:Green; width:100%;height:150px;">cnblogs.com</div>
<div style=" background-color:Blue; width:100%;height:150px;">cnblogs</div>
<div style=" background-color:Olive; width:100%;height:150px;">欢迎光临</div>
<div style=" background-color:Green; width:100%;height:150px;">A</div>
<div style=" background-color:Purple; width:100%;height:150px;">jihua.cnblogs.com</div>
<div style=" background-color:Green; width:100%;height:150px;">B</div>
<div style=" background-color:Lime; width:100%;height:150px;">hello</div>
<div style=" background-color:Orange; width:100%;height:150px;">last</div>
<div style="position:fixed;bottom:50px;right:60px;border:solid 1px #ccc;cursor:pointer;font-family:微软雅黑;"
onclick="$('body,html').animate({scrollTop:0},800);" > 返<br />回<br />顶<br />部</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航