This article has been dead for over three months
You
// Function to get the amount of pixels scrolled
// Copied from the Internet
function getScrollXY() {
var scrOfX = 0, scrOfY = 0;
if( typeof( window.pageYOffset ) == 'number' ) {
//Netscape compliant
scrOfY = window.pageYOffset;
scrOfX = window.pageXOffset;
} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
//DOM compliant
scrOfY = document.body.scrollTop;
scrOfX = document.body.scrollLeft;
} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
//IE6 standards compliant mode
scrOfY = document.documentElement.scrollTop;
scrOfX = document.documentElement.scrollLeft;
}
return [ scrOfX, scrOfY ];
}
// Function to get the Elements with class "fixed"
// It is the same as most function "getElementsByClass" found on the net
// The only difference is that it does not accept parameters,
// they are hard-coded instead
function getFixedElements(){
var classElements = new Array();
var node = document;
var els = node.getElementsByTagName('*');
var pattern = new RegExp("(^|\\s)"+"fixed"+"(\\s|$)");
for (i = 0, j = 0; i < els.length; i++) {
if (pattern.test(els[i].className) ) {
classElements[j] = els[i];
j++;
}
}
return classElements;
}
// The function which scrolls the elements
// to their initial position (relative to the window borders)
// after the page has been scrolled
function maintainFixing(){
var Elements = getFixedElements();
var Scrolling= getScrollXY();
for(ei=0;ei<Elements.length;ei++){
// Fix the Elements to the y axis
Elements[ei].style.top = Elements[ei].initialPositionTop + Scrolling[1];
// Use if you want to fix the elements to the x axis as well
//Elements[ei].style.left= Elements[ei].initialPositionLeft+ Scrolling[0];
}
}
// The function to get the absolute position of an element
// Styling the elements with position:... wont interfere
function getElementPosition(obj){
var curleft = curtop = 0;
if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
}while(obj = obj.offsetParent);
}
return [curleft,curtop];
}
// Get the elements and store their initial position
var Elements = getFixedElements();
for(ei=0;ei<Elements.length;ei++){
var initPos = getElementPosition(Elements[ei]);
Elements[ei].initialPositionTop = initPos[1];
Elements[ei].initialPositionLeft= initPos[0];
}
// Add the event handler to the 'onscroll' event
// This can be avoided by adding onscroll="maintainFixing()"
// to the body tag in your HTML
if(typeof window.attachEvent != 'undefined')
window.attachEvent("onscroll", maintainFixing);
else if(typeof document.addEventListener != 'undefined')
document.addEventListener('scroll', maintainFixing, false);
else
window.onscroll = maintainFixing();