Scrollwheels & frames-like layouts

For some reason, this breaks the scrollwheel

[dingman]

My pet site that you all hear about over and over has a fixed left-side menu, and the rest of the page scrolls. Since IE sucks many [url=ftp://rtfm.mit.edu/pub/faqs/sysadmin-recovery]Lovelace units[/url], I can't just use position:fixed, and therefore used the work-around mentioned here a couple times of using absolute positioning for the fixed elements, taking the scrollbar off of the body element, and wrapping all the stuff that should scroll in a div that gets a scrollbar through overflow: auto. It works just fine, as long as you don't try to use a scroll wheel.

I don't own a mouse with a scrollwheel, because I'm far too attached to my ancient Logitech Trackman Marble [webmasterworld.com]. Therefore, my only data point on whether the scrollwheel works is Opera 7 on Windows 98, which is what my wife uses. Using the scrollbar or arrow keys, scrolling works fine in Moz (& derivatives), NN4, IE6, O6, O7. All were tested running on Linux, though some were Windoze binaries running under Wine.

<added>Er, just to be explicit about it: Anyone know how to fix this? People who use scrollwheels have a tendency to get attached to them, so I'd like to make it work. I'm also trying really hard to avoid any browser sniffing.</added>

[DrDoc]

What exactly "breaks" when using the scroll wheel? Personally I haven't experienced any problems... Which browser version? O7 on Win98?

[dingman]

Scrollwheel just doesn't do anything on that site in O7 under Win98.

[DrDoc]

Is this just on your site though? Maybe there's some general incompatibility between the scrollwheel and O7?

[dingman]

The only site I know of where she has this problem is mine. And I just tried Mozilla on that machine as well and it didn't scroll with the scrollwheel either - but it only fails for my site, so it's not that her scroll wheel isn't configured right.

[DrDoc]

And, sometimes you have to click in the window you want to scroll. This is a common problem on all platforms. If the window as a whole has focus, but not the scrollable part, then nothing will happen. And, I'm afraid there's not much to do about it (unless the whole page is completely scrollable). Luckily, it's not your fault... :)

[dingman]

The click thing doesn't work :(

[DrDoc]

Hmm...

What kind of overflow control are you using? overflow:###?

[dingman]

overflow:auto on both <div>s
Nothing else has overflow explicitly set.

[universalis]

I've looked at quite a few of these "emulate

position:fixed;

on IE6" designs, and the scrollwheel won't work in IE6 with any of them.

Basically, you are doing a massive hack to get around one of IE6's major failings (there are so many!). Most of the designs use something like this:

html {overflow: hidden;} 
body {height: 100%;overflow: auto;}

It seems that the first rule stops the scrollwheel from working, although you can still use the scrollbar.

Sorry, no workaround I know of (other than to convince everyone to upgrade to Mozilla or Opera!).

[DrDoc]

It seems that the first rule stops the scrollwheel from working

I've used a similar CSS construct like the one you mention in your post, but the scroll wheel has still worked. It depends on a lot more, mainly how overflow control is handled in combination with floating content and absolute/relative positioning.

In the end, this is a browser problem, not a CSS problem. IE's implementation of CSS in combination with how it handles OS/hardware dependant functions (such as a scroll wheel) sometimes causes a page to break. However, the key is "sometimes". I've found that it is possible to use both overflow control, floating elements, and positioned elements without interfering with scroll wheel functionality. Then again, that requires testing.

However, dingman's problem seems to be more cross-browser... it even fails in Opera and Mozilla, so that can't be the problem.

[dingman]

However, dingman's problem seems to be more cross-browser... it even fails in Opera and Mozilla, so that can't be the problem.

Yup - in Opera and Mozilla, I can achieve the effect I want with 'position: fixed" on the left <div> and margin-left: $left-div-width on the body. But since IE doesn't understand 'fixed', I have to use this awful kludge that doesn't even entirely work.