window.pageYOffset всегда 0 с переполнением-x: скрытый

Я создаю веб-страницу с некоторым нестандартным содержимым, которое нужно только вставлять в определенное время. Для этого я устанавливаю overflow-x: hidden на html, body. Таким образом, пользователь не может прокручивать влево или вправо, чтобы получить контент.window.pageYOffset всегда 0 с переполнением-x: скрытый

Однако в какой-то момент приложения мне также нужна сумма, которую прокрутил пользователь. Насколько я знаю, window.pageYOffset - один из самых надежных способов сделать это.

Однако, когда я установил правило overflow-x. window.pageYOffset всегда равен 0.

Не должны ли эти вещи быть совершенно несвязанными друг с другом? Как я могу это исправить?

Я тестировал это на Safari, Firefox и Chrome.

Я пробовал document.documentElement.scrollTop, но это работало только на Firefox.

NB:

Я не был в состоянии воспроизвести проблему с очень простым примером. Мое приложение также имеет основное содержимое в контейнере с position: absolute. Если я удалю это, все будет работать.

Это, как представляется, комбинация overflow-x: hidden на body и postion: absolute на .content внутри кузова.

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

Редактировать 2: Он становится еще более странным: у меня есть transform: translate(0,0), установленный на .content, чтобы иметь возможность перейти к другому значению позже. Если я удалю это, все будет хорошо! Еще одно, казалось бы, несвязанное свойство css , которое мешает.

источник

2015-01-20 romeovs

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

Проблема, похоже, исходит от overflow-x: hidden внутри кузова. Таким образом, чтобы исправить это странное поведение я использовал оболочку, как это:

<body> 
    <div class="myWrapper"> 
     All your content here 
    </div> 
</body>

, а затем я переехал атрибут переполнения в CSS обертку вместо того, чтобы позволить его в HTML, тело:

html, body { 
    margin:0; 
    padding:0; 
    height: 100%; 
} 
.wrapper { 
    height: 100%; 
    overflow-x: hidden; 
}

С этим мало трюк, когда я сканирую свое свойство srollTop, которое теперь находится в моем элементе оболочки, результат больше не 0, а реальное значение. Без этого он не работает на Chrome ...

источник

2015-05-05 14:58:50 Solofeed

window.pageYOffset всегда 0 с переполнением-x: скрытый

ответ

Смежные вопросы