返回到顶部按钮实现

时间:2022-05-06
本文章向大家介绍返回到顶部按钮实现，主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。
<div id="gotop"><span class="glyphicon glyphicon-chevron-up"></span></div>  //bootstrap图标
 
#gotop{ 
 display:none;
 font-size: 25px;
 color:#fff;
 text-align: center;
 background: #aaa;
 padding:10px 15px;
 position:fixed;
 right:50px;
 bottom:50px;
 cursor:pointer;   
 }
 
function goTop()
 {
     $(window).scroll(function(e) {
         //若滚动条离顶部大于100元素
         if($(window).scrollTop()>100)
             $("#gotop").fadeIn(1000);//以1秒的间隔渐显id=gotop的元素
         else
             $("#gotop").fadeOut(1000);//以1秒的间隔渐隐id=gotop的元素
     });
};

随机文章
本站知识点必读
最近更新