JS
Изменить значение атрибута класса прокруткой
Пример кода
<html>
<head>
<style>
.test {background-color: yellow;}
</style>
</head>
<body style="height:800px">
<p>Метод "Изменить значение атрибута класса прокруткой".</p>
<p id="myP" style="position:fixed">Прокрутите 10 пикселей от верхней части окна, добавится класс "test" (желтый цвет фона) в этот параграф. Прокрутите вверх, чтобы удалить класс.</p>
<script>
window.onscroll = function() {myFunction()}; /*при прокрутке окна присвоить функцию майФанкшн*/
function myFunction() {
if (document.body.scrollTop > 10
/* если - аргумент: тело документа прокучивается сверху больше чем на 10 пикселей*/
|| document.documentElement.scrollTop > 10 )
/*|| или создан в документе Элемент документа с прокруткой сверху больше чем на 10 пикселей*/
{ document.getElementById("myP").className = "test"; } /*оператор: в документе получить Элемент с АйДи значением мой параграф методом имяКласса присвоить значение тест*/
else { document.getElementById("myP").className = ""; } } /* ещё - оператор: в документе получить Элемент с АйДи мой парагрф методом имяКласса присвоить пустое значение*/
</script>
</body>
</html>
Вывод на экран
Браузер выведет результат работы скрипта - страницу с текстом :"Метод "Изменить значение атрибута класса прокруткой". При прокрутке 10 пикселей от верхней части окна вниз, добавится класс "test" (желтый цвет фона) в параграф. При прокрутке вверх, удалится класс "test" (желтый цвет фона) в параграфе.
Остались вопросы? Нужна помощь? Напишите администратору сайта.