Я обнаружил странное поведение внутри Firefox, которое я пытаюсь обойти.
У меня есть форма внутри контейнера параллакс-прокрутки с использованием perspective: 1px
и transform-style: preserve-3d
. Когда я набираю текст (фактически любой keydown
) во входной элемент, контейнер прокручивается обратно наверх.
Я не понимаю, почему это происходит. Это не так в Safari или Chrome.
Я сделал миниатюрный тестовый пример, который воспроизводит проблему:
<!DOCTYPE html>
<html>
<head>
<style>
body {
height: 100vh;
}
.tall {
height: 1000px;
}
.p-container {
perspective: 1px;
}
.p-child {
transform-style: preserve-3d;
}
</style>
</head>
<body>
<div class="p-container">
<div class="p-child">
<div class="tall">fill space</div>
<div>
<input />
</div>
</div>
</div>
</body>
</html>
Просто прокрутите до нижней части окна и введите ввод, и вы вернетесь наверх.