Фиксированное меню в шапке
Есть скрипт и меню
Не выполняется вот это условие Должно работать так Пользователь находится в верхней позиции сайта Код:
<div id="navbar22"> Код:
<div id="navbar22" class="sticky22"> Код:
<div id="navbar22"> В скрипте не выполняется вот это условие else { navbar22.classList.remove("sticky22"); Сам скрипт window.onscroll = function() {myFunction()}; var navbar = document.getElementById("navbar22"); var sticky_1 = navbar.offsetTop; function myFunction() { if (window.pageYOffset >= sticky_1) { navbar22.classList.add("sticky22") } else { navbar22.classList.remove("sticky22"); } } Пункты меню и само оформление <div id="navbar22"> ..... </div> Вот такой CSS Код:
<style> |
oslayer,
строка 4 зачем? |
отредактировал. все равно не работе :( я совсем в js деревянный
|
в теории понимаю что нужно получить значение верхней позиции сайта
сравнить с текущей и если совпадают по прибить класс.. На практике не знаю как |
oslayer,
<!DOCTYPE html> <html> <head> <title>Untitled</title> <meta charset="utf-8"> <style> #navbar22 { z-index:100!important; background-color: #FF0000; } /* Navbar links */ /* Page content */ .content22 { padding:16px; } .sticky22 { position: fixed; top: 0; width: 100%; } .sticky22 + .content22 { padding-top:60px; } body{ height: 1200px; } </style> <script> document.addEventListener('DOMContentLoaded', function() { window.addEventListener('scroll', myFunction); var navbar = document.getElementById("navbar22"); var sticky_1 = navbar.offsetTop; var w = navbar.scrollWidth; function myFunction() { if (window.pageYOffset >= sticky_1) { navbar.classList.add("sticky22"); navbar.style.width = w + "px"; } else { navbar.classList.remove("sticky22"); navbar.style.width = ""; } } }); </script> </head> <body> <div id="navbar22"> ..... </div> </body> </html> |
Не работает в мобильной версии :( Такой же результат как у моего скрипта
|
мне нужна проверка вертикальной прокрутки... и соответственно условие выполнения если положение верхнее.. Только вопрос.как это сделать
var scrollTop = window.pageYOffset; If if (scrollTop == 0) { navbar22.classList.remove("sticky22"); } Вроде так.. но не работает..:( |
Ларчик просто открывался :)
function myFunction() { if (window.pageYOffset >= sticky_1) меняем на function myFunction() { if (window.pageYOffset > sticky_1) |
Часовой пояс GMT +3, время: 11:26. |