Removing vertical scrollbar in iframe


I am trying to remove the vertical scrollbar in my iframe but I also want the iframe to be vertically scrollable with the mousewheel.

<iframe src="" [B]scrolling="no"[/B] ></iframe>

seems to remove the scrollbar in all browsers but it also disables scrolling with the mousewheel. Any ideas how to do what I want?



There are lots of posts to be found online about disabling scrolling in the iframe, then using JavaScript to capture mouse events or key strokes, then to scroll accordingly.
A simpler way is however, is to use a container div styled with overflow: hidden; to hide the scrollbar. Set the width and the height of the div, to be slightly less than that of your iframe.

For example:

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Hide iframe scrollbars</title>
      #container{width: 500px; height: 300px; overflow: hidden;}
      iframe{width: 518px; height: 318px;}
    <div id="container">
      <iframe src="myIframe.html"></iframe>

Hope this helps you.

Thanks a lot, it works fine. I searched the web but couldn’t find a clear sample such as yours.

GREAT answer - simple, clear and it works. I searched through a lot of other non-working answers before i ran across this one. THANKS!