源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

javascript ie6兼容position:fixed实现思路

  • 时间:2022-11-18 15:00 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:javascript ie6兼容position:fixed实现思路
positon:fixed 让HTML元素脱离文档流固定在浏览器的某个位置 网页中经常会有浮动的导航条会用到这种定位模式,但是ie6下并不兼容这种定位 浮动导航条的样式,重要的是position:fixed;bottom:60px;(浮动导航底部距离窗口底部60px)
[u]复制代码[/u] 代码如下:
.floating_9677{position:fixed; z-index:961; bottom:60px;}
ie6下positon:fixed不起作用,只能靠js来实现了,首先在ie6下需要将position设置为absolute
[u]复制代码[/u] 代码如下:
position:fixed;bottom:60px;_position:abosulte;
给浮动元素加一个属性标识,js通过这个属性能找到这些浮动元素。tag="floatNavigator" 工作中浮动导航条主要通过top或者bottom来定位。
[u]复制代码[/u] 代码如下:
//ie6兼容position:fixed function fixedPositionCompatibility(){ //判断是否ie6浏览器 if( $.browser.msie || parseInt($.browser.version,10) <= 6){ var vavigators = $("[tag='floatNavigator']"); if(!navigators.length)return; //判断每个浮层是靠顶部固定还是底部固定 $.each(navigators, function(){ this.top = $(this).css("top"); this.bottom = $(this).css("bottom"); this.isTop = this.top == "auto" ? false : true; }); window.attachEvent("onscroll", function(){ var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; $.each(navigators, function(){ this.style.top = this.isTop ? scrollTop + parseInt(this.top) + "px" : scrollTop + $(window).height() - $(this).outerHeight() - parseInt(this.bottom) + "px"; }); }); } }
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部