JavaScript ie6 compatible position:fixed implementation ideas_javascript skills

positon:fixed allows the HTML element to be separated from the document flow and fixed at a certain position in the browser
There are often floating navigation bars in web pages that use this positioning mode, but this positioning is not compatible with IE6
Floating The important thing about the style of the navigation bar is position: fixed; bottom: 60px; (the bottom of the floating navigation is 60px from the bottom of the window)

Copy code The code is as follows:

.floating_9677{position:fixed; z-index:961; bottom:60px;}

positon:fixed does not work under ie6, only It can be achieved with js. First, under ie6, you need to set the position to absolute

Copy the code The code is as follows:

position:fixed;bottom:60px;_position:abosulte;

Add an attribute identifier to the floating elements, and js can find these floating elements through this attribute. tag="floatNavigator"
At work, the floating navigation bar is mainly positioned through top or bottom.

Copy code The code is as follows:

//ie6 compatible position: fixed
function fixedPositionCompatibility (){
//Determine whether the ie6 browser is
if( $.browser.msie || parseInt($.browser.version,10) <= 6){
var vavigators = $(" [tag='floatNavigator']");
if(!navigators.length)return;
//Judge whether each floating layer is fixed at the top or at the bottom
$.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";
});
});
}
}