jq点击图标回到顶部

页面中我们经常会遇到这样的问题，一键回到顶部

html代码：这里的代码，可以随意放在页面任何地方

<div class="fixImg"><img src="/img/pic35.jpg" /></div>

css代码：将图片固定在页面合适的位置

.fixImg{width:80px;height: 80px;position: fixed;bottom: 200px;right: 0;}
.fixImg>img{width: 100%;height: 100%;}

js代码：

$(".fixImg").hide();//页面加载进来时已经在顶部所以要隐藏掉
	var winHeight = $(window).height();//获取页面的高度
	$(window).scroll(function() {
	if($(window).scrollTop() > winHeight) {//当滚动条大于页面高度的时候显示图片，反之隐藏
		$(".fixImg").fadeIn(400);
	} else {
		$(".fixImg").fadeOut(400);
	}
});

	$(".fixImg").click(function(event) {//当点击图片时让滚动条距离页面顶部为0，返回顶部
		event.preventDefault();
		$('html,body').animate({
			'scrollTop': 0
			}, 500);
				return false;
	});