Javascript Пользовательский файл не работает на моем сайте в Wordpress - PullRequest
Новая
       44

Javascript Пользовательский файл не работает на моем сайте в Wordpress

0 голосов
/ 09 июля 2020

Это моя проблема, надеюсь, кто-нибудь мне поможет;):

Я делаю сайт для друга на Wordpress. Он спросил меня, можно ли скрыть панель навигации (с прозрачным цветом фона) при прокрутке вниз и появиться, когда она прокручивается вверх (цвет фона синий), когда мы прокручиваем и достигаем изображения заголовка, он хочет, чтобы этот цвет фона стал более прозрачным до тех пор, пока не коснется верхней части страницы и не станет прозрачным.

Я написал файл js, который я вставляю в свою дочернюю тему со сценариями верхнего и нижнего колонтитула плагина. Кажется, он загружен на моем веб-сайте, но не работает на панели навигации ..

Я пытался изменить имя класса, но он не работает .. Также я создаю файл CSS на моя дочерняя тема и модификации работают, я изменил фиксированную позицию на элементе с правильным именем класса. Я пробовал другой проект, и он работает. Я думал, что это не работает, потому что прослушиватель событий, и я создаю событие прокрутки для содержимого моей страницы с помощью elementor ..

Это мой Js код: 

let nav = document.getElementsByClassName('site-navigation');
let lastScroll = 0;   

window.addEventListener('scroll', function () {
    let scroll = window.pageYOffset || document.documentElement.scrollTop;

    if(scroll > lastScroll){
        nav[0].style.top = '-80px';


    }else if(scroll < lastScroll && scroll > 700) {
        nav[0].style.top = '0';
        nav[0].style.backgroundColor = 'blue';
    }else if(scroll < lastScroll && scroll > 650) {
        nav[0].style.backgroundColor = 'rgba(33, 41, 202, 0.9)';
    } else if(scroll < lastScroll && scroll > 500){
        nav[0].style.backgroundColor = 'rgba(33, 41, 202, 0.7)';
    }else if(scroll < lastScroll && scroll > 350){
        nav[0].style.backgroundColor = 'rgba(33, 41, 202, 0.5)';
    }else if(scroll < lastScroll && scroll > 200){
        nav[0].style.backgroundColor = 'rgba(33, 41, 202, 0.3)';
    } else if(scroll < lastScroll && scroll > 30){
        nav[0].style.backgroundColor = 'transparent';
        nav[0].style.top = '0';
    }

    lastScroll = scroll;
})
...