@marki1404
Я Front-end програмист

Как при скролл менять фон скролла?

Я хочу, если я дойду до 800px, фон моего скролла менялся. Как это сделать?
  • Вопрос задан
  • 214 просмотров
Решения вопроса 1
@Mikelius
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>1</title>
  <style media="screen">
    body.a::-webkit-scrollbar {
      background: silver;
    }
    body.b::-webkit-scrollbar {
      background: red;
    }
    body::-webkit-scrollbar-thumb{
      background: black;
    }
  </style>
</head>
<body class="b">
  <div style="height: 3000px">ed</div>
  <script type="text/javascript">
    body = document.getElementsByTagName('body')[0]
    window.onscroll = () => {
      var scroll = window.pageYOffset;
      if (scroll >= 800){
        body.classList.add("b");
        body.classList.remove("a");
      } else if (scroll <= 800){
        body.classList.add("a");
        body.classList.remove("b");
      }
    }
  </script>
</body>
</html>

Кое-как работает, но только если навести после мышку на scroll-bar и не все браузеры поддерживают webkit-scrollbar caniuse . Надеюсь чемто помог.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Sveak Барнаул
от 50 000 руб.
UMA.TECH Москва
от 150 000 до 215 000 руб.
Sirena Bus Москва
от 70 000 до 150 000 руб.
19 июн. 2019, в 15:48
300 руб./в час
19 июн. 2019, в 15:18
100000 руб./за проект
19 июн. 2019, в 15:14
500 руб./за проект