标签：
比较简单的一个东西，记录下：
主要是监控$(window).scroll()事件。
jquery.top.js
/**
* jQuery返回顶部
* @author:xuzengqiang
* @since :2015-1-30 14:45:59
**/
;(function($){
jQuery.fn.backTop = function(options){
var defaultOptions = {
hideIndex:200, //隐藏的位置
hideTimer:1000, //隐藏返回按钮所用时间
backIndex:0, //移动的位置,默认返回顶部
backTimer:500 //返回顶部所需时间
};
var settings = jQuery.extend(defaultOptions, options || {}),
current = $(this);
$(window).scroll(function(){
var timer = settings.hideTimer;
if($(this).scrollTop()>=settings.hideIndex){
current.fadeIn(timer);
} else {
current.fadeOut(timer);
}
});
return this.each(function(){
current.click(function(){
$("body,html").stop(false,true).animate({scrollTop:settings.backIndex},settings.backTimer);
});
});
};
})(jQuery);调用例子：
<!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" />
<title>无标题文档</title>
<style type="text/css">
*{margin:0;padding:0;font-family:微软雅黑;}
body{height:10000px;}
.rollTop{height:40px;width:40px;position:fixed;left:95%;top:90%;display:none;}
</style>
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript" src="jquery.top.js"></script>
</head>
<body>
<button class="rollTop"></button>
</body>
<script type="text/javascript">
jQuery(document).ready(function(){
$(".rollTop").backTop({"backTimer":200});
});
</script>
</html>
标签：
原文地址：http://blog.csdn.net/xuzengqiang2/article/details/43307363
