您现在的位置:首页 >> 前端 >> 内容

返回顶部jQuery+css实现

时间:2017/4/10 9:23:00 点击:

  核心提示:返回顶部jQuery+css实现:1、在需要添加返回顶部功能的页面的head标签中添加。2、添加js$(document).ready(function($) {if($(meta[name=toTo...

返回顶部jQuery+css实现:1、在需要添加返回顶部功能的页面的head标签中添加。



2、添加js


$(document).ready(function($) {    
    if($("meta[name=toTop]").attr("content")=="true"){
        $("

").appendTo('body'); $("#toTop").css({ width: '50px', height: '50px', bottom:'10px', right:'15px', position:'fixed', cursor:'pointer', zIndex:'999999', }); if($(this).scrollTop()==0){ $("#toTop").hide(); } $(window).scroll(function(event) { if($(this).scrollTop()==0){ $("#toTop").hide(); } if($(this).scrollTop()!=0){ $("#toTop").show(); } }); $("#toTop").click(function(event) { $("html,body").animate({ scrollTop:"0px"}, 666 ); }); } });


注意:此段代码采用了bootstrap自带的图标,若没有采用bootstrap的话,
此处用图片代替即可,即。

作者:网络 来源:廖宁波