两种方式实现页末置顶图片兼容ie,firefox,google

本文介绍了两种实现页末置顶图片的方法,兼容IE、Firefox、Chrome等浏览器。第一种方法使用纯JavaScript,通过监听滚动事件并设置定时器平滑滚动回顶部。第二种方法利用jQuery,同样实现点击回到顶部功能,并在窗口缩放时调整图片位置。
摘要由CSDN通过智能技术生成

方式1:纯js实现

1 Css文件中设置btn样式

#goTopBtn {
 POSITION: fixed;   LINE-HEIGHT: 70px; WIDTH: 70px; BOTTOM: 35px; HEIGHT: 70px; FONT-SIZE: 12px; CURSOR: pointer; RIGHT: 0px; _position: absolute; _right: auto
}

2 scrolltop.js

// JavaScript Document 兼容各浏览器
function goTopEx(){
        var obj=document.getElementById("goTopBtn");

 

        //获取页面scrollTop 

        function getScrollTop(){
            //return document.documentElement.scrollTop;

            //ff / chrome safari / ie 浏览器兼容
            return document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; 

            }

        //设置页面scrollTop

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值