首页 > 代码库 > jquery返回页面顶部
jquery返回页面顶部
1、此博文图片样式引用腾讯网站,效果如下:
2、样式设置:
1 #toTop { 2 /*选中的背景图片的大小*/ 3 width: 54px; 4 height: 54px; 5 display: none;/*刚开始不显示*/ 6 position: fixed; 7 right: 25px;/*距离右边大小值*/ 8 bottom: 45px;/*距离底部大小值*/ 9 /*选定图片区域*/ 10 background-image: url(images/qqbg_1.5.5.png); 11 background-repeat: no-repeat; 12 background-position: -700px -110px; 13 opacity: 0.3; /*透明度*/ 14 } 15 16 #toTop:hover { 17 opacity: 1;/*悬停时不透明*/ 18 filter: alpha(opacity = 100); 19 }
3、JS代码:
1 <a href=http://www.mamicode.com/"#" target="_self" id="toTop" title="返回顶部" onclick="window.scrollTo(0,0);return false"></a> 2 <script type = "text/javascript"> 3 function toTopHide(){ 4 $(document).scrollTop()>400? 5 $("#toTop").show() 6 :$("#toTop").hide(); 7 } 8 $(window).scroll(function(){toTopHide()}); 9 </script>
jquery返回页面顶部
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。