Подсчитайте, сколько пользователь прокрутил (включая поля и отступы)

0

Я застрял с очень неприятной проблемой. Я пытаюсь создать скрипт, который изменяет строку меню (CSS), когда пользователь имеет прокрутку X пикселей (высота элемента заголовка). Тем не менее, любой сценарий jQuery, который я пробовал, не правильно вычисляет пройденное расстояние. После некоторых пикселей он перестает считать и продолжает... а затем возобновляет, останавливает, возобновляет и т.д.

Я думаю, что это может иметь какое-то отношение к заполнению и/или полям. Во всяком случае, мне нужна поддержка.

Проверьте текущий сайт, добавив скрипт с прокруткой по расстоянию.

Автор сценария:

$(window).scroll(function() {
  var scrollTop = $(window).scrollTop();
  console.log(scrollTop);
});
  • 0
    Вы должны анимировать свои переходы, чтобы сделать его более плавным. Текущее поведение абсолютно правильно. Событие scroll генерируется, как только страница уже отрисована. Рендеринг вашей страницы занимает много времени. Отсюда и задержки в прокрутке.
Теги:
scroll
scrolltop
offset

1 ответ

1

У вас есть две полосы прокрутки для начала. Добавить overflow: inherit; к вашему телу css, чтобы решить это.

DEMO

Это должно сделать примерно то, что вы хотите. При прокрутке 120px заголовок сглаживает верхнюю часть содержимого.

Если это не поможет, пожалуйста, опишите, что именно вы пытаетесь добиться немного лучше.

  • 0
    Ну, это именно проблема, действительно! Не могли бы вы уточнить свой ответ, почему удаление (без добавления inherit ) overflow-x:hidden; меняет способ прокрутки страницы? Переполнение-x основано на горизонтальной оси, а прокрутка является вертикальной (у) осью?
  • 1
    Я рад! Кажется, проблема сейчас исправлена, но у вас была независимая полоса прокрутки для тела внутри html, которая создала две полосы прокрутки. Я предположил, что это был артефакт из шаблона параллакса, и добавление overflow:inherit; было просто делом домашнего хозяйства overflow:inherit;

Ещё вопросы

Сообщество Overcoder
Наверх
Меню