6

I am currently working on project about car travelling http://wayfi.ru and

I have encountered a problem recently - page content shifts to the left after vertical scroll appears. How to prevent this?

As I know, one could always display disabled scroll and make it enable if there is necessary.

Do you know better technique to accomplish this?

makaroni4
  • 2,281
  • 1
  • 18
  • 26

1 Answers1

6

I'm afraid I do not know of any other way to do this apart from always showing the scrollbar, active or not.

The simplest way I think is:

html {
    overflow-y: scroll; 
}

This way, even on pages without scrolling there is space reserved for the scrollbar and the content won't jump around between pages.

tw16
  • 29,215
  • 7
  • 63
  • 64
Caroline Elisa
  • 1,246
  • 6
  • 18
  • 35
  • The OP specifically asks for a way that doesn't involve showing the scrollbar the whole time. – tw16 Aug 10 '11 at 08:57
  • @tw16: As far as I know, there is no better fix. – thirtydot Aug 10 '11 at 09:01
  • You should set it on `html` instead of `body` to avoid edge case problems such as [this](http://blogs.microsoft.co.il/blogs/pintyo/archive/2010/11/06/double-scrollbars-with-quot-overflow-y-scroll-quot-on-ie7-when-using-cssstickyfooter.aspx) in IE7. – thirtydot Aug 10 '11 at 09:03
  • @thirtydot: I agree. I don't know one either. But I was pointing out that the OP already knew about this solution and was asking if there was a better/different way to solve the problem. – tw16 Aug 10 '11 at 09:07
  • @tw16, my bad for not understanding the question properly. – Caroline Elisa Aug 10 '11 at 09:10
  • I still think your answer is the correct technique. In fact I gave a very similar [answer](http://stackoverflow.com/questions/6999257/vertical-scrollbar-position-absolute/7001779#7001779) just yesterday! But given the wording of the question, I think you should just explain that you do not know of any other way of to achieve it etc. (Though as @thirtydot said I would use html not body) – tw16 Aug 10 '11 at 09:16
  • One of my friend offered me another way to do it - one could create custom javascript scroller and hide default at all. What do you think about that? – makaroni4 Aug 11 '11 at 06:03