Hello! I am working on a small but very compensating problem. You need to implement javascript, which would keep the site in balance with the disappearance or appearance of the scroll bar. It is necessary to catch the event of appearance or disappearance in some way, to which I can not guess.

In order to align the site without a strip, you need to do this:

$('.container').css('position','relative').css('right','3px');

When there is a strip, then:

 $('.container').css('position','relative').css('right','0px');

I use JQ. How can I solve this problem? Thank you in advance

  • And what is the real purpose? - Qwertiy ♦

4 answers 4

Probably the scroll-bar disappears or appears when the window is resized or other actions, respectively, you can assign a function launch to this event. Or, for example, you can get away with tricks in css, if you just need to center the container (I make this assumption judging by the given code).

    For webkit's you can use

     overflow: overlay

    so that the scroll bar is located inside the element.
    But we must not forget to make a suitable padding, so that it never closes the contents of the element.

      I set the rule for my sites body { overflow-y: scroll; } body { overflow-y: scroll; } and not worried. :)

        I also try to track the appearance of scroll-a.

        The method of selection found this option:

         document.documentElement.addEventListener('overflow', function() { console.log('scollbar is visible'); }); document.documentElement.addEventListener('underflow', function() { console.log('scollbar is invisible'); });

        but only works in Firefox.

        Later I saw this page: https://developer.mozilla.org/en-US/docs/Web/Events/overflow

        • Welcome to Stack Overflow in Russian ! here it is customary to give a complete answer, and references are given only as a supplement / illustration. - aleksandr barakin