继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

PC端html中scroll事件的全兼容写法

玅郎君
关注TA
已关注
手记 5
粉丝 4
获赞 24

做企业网站页面高度太大就会产生滚动条,这时我们需要做一个回到顶部的按钮,需要:body在顶端的时候隐藏,发生scroll事件的时候出现,点击的时候滚动条回到顶端,部分代码如下:

$(window).scroll(function() {
        var scroll = $("body").scrollTop()||$(document).scrollTop();//兼容IE8、chrome和firefox
        if(scroll <= 0) {
            $(".back_to_top").hide();
        } else {
            $(".back_to_top").show();
        }
    })

    $(".back_to_top").click(function() {
        $("body,html").stop().animate({
            scrollTop: "0px"
        },500)
    })
打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP