Question

Is it possible using jQuery to shift the content of a page say 10px to the right when the scroll-bar becomes visible. The reason it isn’t automatically visible is because my content expands via jQuery, and when it reaches the point at which it’s height exceeds the browsers, the scroll-bar is displayed, causing all page content to shift to the right about 10px or so.

I’d like it so that this doesn’t happen, and the content stays in the same position, while the scroll-bar is visible.

I’m not sure if CSS properties such as body { scroll-bar: x; } (I’m assuming that scroll-bar is the correct property for the scroll-bar) can be used as jQuery selectors, and even if so, how this would work?

Any help, answers, references to other articles where this is done would be great :)!

Answer 1

You could use CSS to force the scrollbar to always be visible:

body { overflow-y: scroll; }