Forum Moderators: open
Here's the issue. I've been utilizing the code for conditionally sticky sidebar at a site that can be found by Googling "Conditionally Sticky Sidebar." The gist of it (since I can't link to it) is that a sidebar keeps its absolute positioning until it reaches the top of the screen when JS changes it to fixed positioning so that it stays at the top of the screen while you scroll.
Anyway, it works perfect in Firefox and Safari, but the problem is (of course), Internet Explorer.
In IE7 (which the script is supposed to work in), it scrolls, but on scrolling, it shifts all of the div contents to the right to be almost centered horizontally. I figured this probably has to do with the fact that it's not aligned with the edge of the window (like the example of the site I can't link to), but how can I fix this?
In IE6, it's not designed to work, but is there *ANY* way to make it at least appear to do the same thing? I still have to support that awful browser.
Here's the code. Imagine it's tabbed properly.
window.onscroll = function() {
if (window.XMLHttpRequest) { // IE 6 doesn't implement position fixed nicely...
if (document.documentElement.scrollTop >= 269 ¦¦ self.pageYOffset >= 269) {
$('scrolly').style.position = 'fixed';
$('scrolly').style.top = '0';
} else if (document.documentElement.scrollTop < 269 ¦¦
self.pageYOffset < 269) {
$('scrolly').style.position = 'absolute';
$('scrolly').style.top = '269px';
}
}
}
And there's nothing special about the div tag. It's in a table cell design (and I *don't* want to hear about that, we already agonized over that) and the whole design is centered horizontally.
I know all this is vague (because I can't link to anything, thanks guys!) but can anyone help? Please?