div respond to scrollmouse like iframe in Firefox

Forum Moderators: open

Message Too Old, No Replies

div respond to scrollmouse like iframe in Firefox

carsten888

7:51 am on Nov 22, 2005 (gmt 0)

how to make a scrollable div respond to a scroll-wheel-mouse like an iframe in Firefox.

when over an iframe you can scroll its content by using a scroll-wheel mouse. Try this with a textarea and you find you first have to give focus to that element before the scroll-wheel-mouse can be used. With a <div style="overflow: auto; height: 200px;"> Apparently in Firefox no scroll-wheel-mouse can be used at all on scrollable div's. It only allows scrolling by using the arrow on scrollbar or scrollbar-arrows.

Regrettably I have to say IE is fine with this, Firefox is not.

Robin_reala

9:41 am on Nov 22, 2005 (gmt 0)

Yep, it's a bug. It was fixed about a year ago but only made it into trunk builds - the code that has eventually become Firefox 1.5.

CritterNYC

8:40 am on Nov 23, 2005 (gmt 0)

So, basically, it'll be fixed on or about November 29th.

carsten888

7:56 am on Nov 24, 2005 (gmt 0)

Do you mean that one of these days a new version of Firefox will be available which does not have this bug?

If so, all older versions still have this bug, is there a workaround for this?

I have experimenten with javascript to give focus to the <div> on mouseover, works for textareas, but not for div's in firefox.

Robin_reala

9:38 am on Nov 24, 2005 (gmt 0)

Exactly. Firefox 1.5 comes out (probably) on the 29th Nov and has had this bug fixed. It's not however being retroactively applied to Firefox 1.0, so those users will still have the bug.

There is however a bit of Javascript that'll (sort of) fix this for 1.0 users. This is courtesy of Morten Nilsen who came up with this workaround on the original bug discussion:

<html>
 <head>
  <title>Mozilla bug #9728 workaround v.2</title>
  <style type="text/css">
   div {
    width: 200px;
    height: 100px;
    overflow: auto;
    border: solid 1px black;
   }
  </style>
  <script type="text/javascript">
   function fixScroll(div) {
    var s = div.scrollTop;
    div.childNodes[1].focus();
    div.scrollTop = s;
   }
  </script>
 </head>
 <body>  <div onmouseover="fixScroll(this);">
   <a></a>
   Long text Long text Long text Long text Long text Long text Long text Long text
   Long text Long text Long text Long text Long text Long text Long text Long text
   Long text Long text Long text Long text Long text Long text Long text Long text
   Long text Long text Long text Long text Long text Long text Long text Long text
   Long text Long text Long text Long text Long text Long text Long text Long text
   Long text Long text Long text Long text Long text Long text Long text Long text
  </div>
 </body>
</html>

encyclo

11:38 am on Nov 24, 2005 (gmt 0)

One thing about the forthcoming Firefox 1.5 - as the 1.0 version has achieved a far wider reach than any other previous Mozilla product, this is going to be about the first time when it will be necessary to support multiple versions of a Gecko browser for a significant time. Many FF1.0 users are non-technical users who won't upgrade immediately (or indeed ever) to 1.5 or beyond, and 1.0 doesn't have the auto-update mechanism to encourage upgrading.

Your bug may well remain a problem for some users for longer than you would think.

carsten888

6:05 pm on Nov 24, 2005 (gmt 0)

awsome!

thank you loads!