Prevent Bounce Scroll in Lion

Just make sure you zero out the margin and padding on those elements as well (normal in any reset or normalization).

html, body {
  height: 100%;
  overflow: hidden;


  1. User Avatar
    Permalink to comment#

    As a Lion user, please don’t do that on your website. Don’t take out my bouncing fun..

  2. User Avatar
    Eric L Pheterson
    Permalink to comment#

    I agree, I like bouncy scrolling. If it’s all the same to you, leave it.

  3. User Avatar
    Permalink to comment#

    What? no get rid of it. At what point did the user need some stupid extraneous bouncing to let you know you were at the bottom of a page? surely the fact that it has stopped scrolling is enough.

  4. User Avatar
    Nabil Gardon
    Permalink to comment#

    I’m sorry, but this code hides whatever is outside of the base visible rectangle. In other words, this code prevents scrolling all together…

    And I agree, bounce scroll is hideous, and really useless. I would love to disable it as an iPad user…

  5. User Avatar
    Permalink to comment#

    I’m behind this bit of CSS. The bounces can mess with some elements as it treats the bounce area as part of the document… also I find a lot of the time your nice smooth momentum scroll suddenly turns to jerky, bad frame rate rendering as it comes to a stop. A solid stop is fine!

  6. User Avatar
    Permalink to comment#

    Well, it could make sense if bounce scrolling wasn’t a part of OS X / iOS common user experience. You want your website to scroll the way you’re used to, but user actually wants it to behave the way he is used to.

    If you «stand out the crowd» making your site scroll the different way, user will eventually notice it.

    But, will he like it?

    It reminds me of awful user experience on Windows®, where half of apps are skinned in their own fancy way.

  7. User Avatar
    Permalink to comment#

    It might not be good UX, but in some cases you really need to get rid of the bouncy scrolling.

    But how can we get rid of it without hiding the scrollbars?

  8. User Avatar
    Permalink to comment#


  9. User Avatar
    Neil Kalman
    Permalink to comment#

    This snippet isn’t meant to disable the bouncing of scrolls all together.

    Basically, Mac will bounce on everything that have the potential of scroll in it (as far as I know)

    This little snippet is to prevent the bouncness of non-scrollable sites.

    In that case, it’s a bad UI for the app to bounce even though you can’t scroll through it.
    That’s because, even though the element isn’t long enough to have a scrollbar, it is potentially scrollable, so Mac gives it a bounce effect.

Leave a Comment

Posting Code!

You may write comments in Markdown. This makes code easy to post, as you can write inline code like `<div>this</div>` or multiline blocks of code in triple backtick fences (```) with double new lines before and after.

Code of Conduct

Absolutely anyone is welcome to submit a comment here. But not all comments will be posted. Think of it like writing a letter to the editor. All submitted comments will be read, but not all published. Published comments will be on-topic, helpful, and further the discussion or debate.

Want to tell us something privately?

Feel free to use our contact form. That's a great place to let us know about typos or anything off-topic.