Прокрутите верхние тормоза, если появится дополнительный div JavaScript - PullRequest
Новая
       19

Прокрутите верхние тормоза, если появится дополнительный div JavaScript

0 голосов
/ 16 октября 2018

У меня есть фиксированная позиция слева от всплывающей навигационной панели, которая при прокрутке устанавливает выравнивание по верху, я делаю это с помощью следующих JavaScript и CSS.

CSS 

    .sidenav {
    height: 100%;
    position: fixed;
    width: 0;
    z-index: 99;
    top: 96px;
    left: 0;
    background-color: #f0f1f3f2;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 50px;
}

.sidenavScroll {
height: 100%;
width: 0;
position: fixed;
z-index: 99;
top: 0;
left: 0;
background-color: #f0f1f3f2;
overflow-x: hidden;
/*transition: 0.5s;*/
padding-top: 50px;
}

JavaScript 

 function onScrollNav() {
   if (document.body.scrollTop > 40 || document.documentElement.scrollTop > 40) {
        document.getElementById("mySidenav").className = "sidenavScroll";
        console.log("you hit 40px !!");
    } else {
        document.getElementById("mySidenav").className = "sidenavScrollReset";
        console.log("you back to 0 !!");
    }
}

Хорошо просыпается, если не появляется всплывающее окно с cookie или что-то подобное, это затем толкает все вниз и, когда у меня фиксированное положение, боковая навигациятеперь находится над главной верхней навигацией, так как она была нажата.У моего основного заголовка есть ID top-nav.

Я считаю, что если бы я мог настроить прокрутку для top-nav Id , это могло бы сработать.

Как я пытался 

window.onscroll = function () {onScrollNav()};

    function onScrollNav() {
       if (document.getElementById("top-nav") > 40 || document.documentElement.scrollTop > 40) {
            document.getElementById("mySidenav").className = "sidenavScroll";
            console.log("you hit 40px !!");
        } else {
            document.getElementById("mySidenav").className = "sidenavScrollReset";
            console.log("you back to 0 !!");
        }
    }
...