Почему отображаются две вертикальные полосы прокрутки?

Question

Я сделал что-то подобное, чтобы сначала скрыть полосу прокрутки тела, а затем показать ее при нажатии на ссылку:

$('body').css('overflow', 'hidden');
$('#site').click(function(e) {
    $('#wrapper').remove();
    $('body').css('overflow', 'scroll');
    return false;
});

Сначала он скрывает полосу прокрутки и просто показывает полосу прокрутки для наложения (абсолютно позиционированный div (#wrapper)), но когда я нажимаю на ссылку (#site), чтобы снова показать полосу прокрутки (и удалить наложение) теперь отображаются две полосы прокрутки: одна работает, другая отключена.

HTML:

<div id="wrapper">
   --- some content ----
   <a href="" id="site"></a>
</div>

<div>
   --- rest of the website ---
</div>

CSS:

#wrapper {  
    background-color: #CCC;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99999; 
    height: 800px;
}

Что пошло не так?

Answer 1

Нашел решение моей проблемы.Мне просто нужно было добавить:

$('html').css('overflow', 'hidden');

Answer 2

В моем случае я попытался

$('html').css('overflow', 'hidden');

, который удалял две боковые панели, но я не смог прокрутить вниз до нижнего колонтитула.

Я использовал:

$('html').css('overflow-x', 'initial');

Работает отлично, показывает только одну полосу прокрутки по вертикали и прокручивается ко всему содержимому внизу

Answer 3

Вы также можете использовать это, если что-то из темы или стиля вызывает вторую полосу

html {
  overflow-x: initial !important;
}

Answer 4

Это решило проблему для меня:

body{overflow-y:auto}

Answer 5

Под двумя полосами прокрутки вы подразумеваете вертикальную и горизонтальную полосу прокрутки? Если это так, используйте переполнение: авто вместо прокрутки

http://jsfiddle.net/DmqbU/2/

Это будет эффективно показывать полосу прокрутки только при необходимости (если горизонтальное содержимое шире, чем ширина, или вертикальное содержимое выше высоты)

Answer 6

Используйте overflow-x и overflow-y для управления горизонтальными и вертикальными полосами прокрутки. Просто установите overflow-x: none;, чтобы прекратить показывать горизонтальную полосу.