简单的JQuery top返回顶部
一个最简单的JQuery Top返回的代码,Mark一下:
HTML如下:
<div id="backtop"> <a href="javascript:;">TOP</a> </div>
CSS样式:(随意修改样式)
#backtop{ display: none; position: fixed; right: 50px; bottom: 110px; } #backtop a{ display: block; padding: 10px 5px; background:#59b524; color: #fff; font-size: 16px; font-weight: bold; } #backtop a:hover{ background:#439b11; }
最关键的来了,JQuery如下:
$(function(){ //当滚动条的位置大于距顶部0像素时,跳转链接出现,否则消失 $(function () { $(window).scroll(function(){ if ( $(window).scrollTop()>0){ $("#backtop").fadeIn(1200); } else { $("#backtop").fadeOut(1200); } }); //当点击跳转链接后,回到页面顶部位置 $("#backtop a").click(function(){ $('body,html').animate({scrollTop:0},800); return false; }); }); });
OK。搞定!
我就是我,记性不好,那就用写的吧。