栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

常见效果实现之返回顶部(结合淡入、淡出、减速滚动)

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

常见效果实现之返回顶部(结合淡入、淡出、减速滚动)

在性能方面考虑了由于连续触发onscroll事件,频繁调用回调函数而产生的性能问题。可以将回调函数缓存一段时候后执行,即当这段时间内多次触发了onscroll事件,但回调函数只会执行一次。

复制代码 代码如下:




结合淡入/淡出/减速运动效果实现的返回顶部功能

.fixed{
position:fixed; bottom:100px; width:20px; right:100px; height:80px; font-size:12px;
     cursor:pointer; background-color:#ccc; opacity:0; filter: alpha(opacity=0);
}
.placeholder{ height:2000px;}




返回顶部


placeholder



兼容性和bugs相关问题:
1 opacity: function(elem, val){
  if(val){//使用这种判断方式当传0,空字符串时会产生BUG 。
2:document.documentElement.scrollTop chrome取不到值 。
3: elem.style.opacity 读取不到在CSS Class中定义的值。
4:IE6不支持fixed定位,虽然可以使用absolute模拟。不过很有很多网站都它进行了降级处理。
转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/113367.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号