Ошибка: JavaScript Scroll Magi c и категории «Скрыть и показать» - PullRequest
Новая
       96

Ошибка: JavaScript Scroll Magi c и категории «Скрыть и показать»

0 голосов
/ 20 июня 2020

Я создавал сайт-портфолио из учебника, но некоторые функции из javaScript, похоже, не работают, изображения, которые я предоставил ниже, показывают 4 индикатора выполнения навыков, которые должны анимироваться при прокрутке вниз страница. Я использовал для этого scroll magi c, я проверил все, что мог, о том, чтобы файлы скриптов синхронизировались до Index. html (в той же подпапке и правильно названы). Файл Script. js синхронизируется с индексом, поскольку я тестировал его с другими функциями. Я также проверил соответствие всех идентификаторов и классов, полагаю, я допустил ошибку в самом скрипте, как показано ниже.

Ниже показано, как индикаторы выполнения должны анимироваться при прокрутке вниз.

Изображение Scroll Magi c Функциональность Моя вторая проблема заключается в том, что в моем портфолио есть 3 кнопки навигации, которые связаны с 3 различными наборами изображений (2 набора скрыты). Я надеялся, что скрипт скроет текущую активную кнопку категории и покажет любую другую выбранную кнопку. изображение активных и скрытых вкладок портфолио 

.setTween(t1)
.addTo(contoller)

const showRequiredCategory = event => {
    const getId = event.id
    const links = document.querySelectorAll('.work-category button')
    for(i=0; i<links.length; i++) {
        if(links[i].hasAttribute('class')) {
            links[i].classList.remove('active')
        }
    }

    event.classList.add('active')
    const getCategory = document.querySelector(`.category-${getId}`)
    const categories = document.querySelectorAll('div[class ^= "category-"]')
    for(i=0; i<categories.length; i++) {
        if(links[i].hasAttribute('class')) {
            links[i].classList.remove('showCategory')
            links[i].classList.add('hideCategory')
        }
    }

    getCategory.classList.remove('hideCategory')
    getCategory.classList.add('showCategory')
}
image

Очень благодарен мастеру стека, который помог мне.

PS. все файлы находятся в одном каталоге ie. ScrollMagi c, TweenMax и др. c.

...