pwnt.be

I added a nice effect to this site’s sidebar earlier today: it now stays in the viewport as you scroll vertically. So it’s kind of like position: fixed, except that it’s more dynamic and supported by Internet Explorer. Thanks to MooTools, it doesn’t take a whole lot of JavaScript, and it’s compatible with all of today’s modern browsers.

Opera by ex.libris
Some rights reserved

Except that it isn’t. There was a time when Netscape Navigator was a cause of many a headache, then came the numerous Internet Explorer woes, but what a lot of people are forgetting is that the Opera guys have always had their own ideas about web development as well.

Obviously, I mention this because my scrolling sidebar was seriously fucked up in Opera. The Element.getCoordinates() function returns the wrong values—that is to say, I assume Opera is wrong, since every other browser I tried was consistent. Specifically, the element’s offsetParent is the document body, but its offsetLeft just contains the distance from the viewport edge. I won’t even get into offsetTop, since I can’t explain it.

I assume Opera doesn’t like when you add margins or padding to the document body—but then it shouldn’t apply them while rendering the page either. I could probably fix it by adding a wrapping <div> inside the body, but instead, I did some major JavaScript hacking. Lame.

And, obviously, the feline has nothing to do with the Opera web browser. I just typed “opera” into Flickr’s search box and that picture stood out.

On a different note, since this site uses alternate style sheets, it would be nice if scripts could listen for style sheet change events, as those affect the position of the scrolling sidebar. Right now, my code just verifies the position at given intervals, which is pretty resource-intensive compared to an event handler that’s invoked when appropriate.