1

Есть код. Подскажите верна ли реализация?

Суть такая - есть шапка сайта которая имеет два класса с разными css стилями. При скроллинге вниз она меняет свои стили, а если поднять в начало страницы то получает исходные значения.

Вопрос такой: правильно ли реализован код (код работает)? Просто хочу узнать мнение.

window.onscroll = function() {
  document.querySelector('#header');
  var el = document.documentElement.scrollTop;
  if (el > 1) {
    document.querySelector('#header').classList.add("sticky");
  } else {
    document.querySelector('#header').classList.remove("sticky");
  }
};
8
  • Не понятно, в чем великий смысл второй строки кода? 26 мар 2018 в 15:08
  • всё норм, только повторяющиеся вызовы заверните в указатель на объект DOM - переменную: var header = document.querySelector('#header'); и с ним уже работайте.
    – Kirill
    26 мар 2018 в 15:15
  • @KirillKorushkin, не очень-то норм, а вот полезных повторяющихся вызовов там как раз нет.
    – Qwertiy
    26 мар 2018 в 15:23
  • @AntonShchyrov А что именно не так я новый человек в js 26 мар 2018 в 15:25
  • 1
    @KirillKorushkin Пожалуйста, постарайтесь публиковать развернутые ответы содержащие конкретный пример минимального решения, дополняя их ссылкой на источник. Ответы–ссылки (как и комментарии) не добавляют знаний в Рунет. 8 апр 2018 в 14:16

1 ответ 1

2
window.onscroll = function() {

Лучше подписываться через addEventListener.

Ещё нет проверки, какой именно элемент прокручивается. В данном случае это некритично, но потенциально может вызывать лишние перерессчёты и влиять на производительность.

document.querySelector('#header');

Бесполезный код.

var el = document.documentElement.scrollTop;

Называть число (позицию скролла) элементом не следует.

if (el > 1) {

0px и 1px считаются непрокрученными, а всё остальное - прокрученным?

Если это действительно то, что требуется, то я бы записал >=2 (с учётом того, что число всегда целое), потому что иначе без комментария неясно, ошибка это, или так задумано.

2
  • а как передать начальное положение скрола? что бы убрать var el 26 мар 2018 в 15:35
  • не убрать надо, а переименовать просто
    – Qwertiy
    26 мар 2018 в 17:12

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.