Функция JS для изменения страницы не показывает nextPage - PullRequest
0 голосов
/ 26 сентября 2019

Новичок здесь строит мой второй сайт, пытаясь разобраться с основами.

У меня есть два HTML-документа, и я пытаюсь использовать JS для навигации между ними, это, безусловно, самая продвинутая вещь, которую я сделал на сегодняшний день, поэтому я не знаю, что я могу даже попробовать!

Я проверил основы:

  • , убедившись, что я вызвал правильные переменные
  • проверил, что класс .page указан на странице / разделе, который я пытаюсьдля отображения.

Я следил за видео на YouTube - но мой дизайн, содержание и страницы отличаются, поэтому видео не помогло в этом случае.

Моя цель - щелкнуть по второй точке (svg в .toggle), чтобы отобразилась страница галереи (первая страница исчезает нормально: D).Я скопировал код, который я считаю актуальным (я, вероятно, ошибаюсь?), Поэтому дайте мне знать, если нужно больше.

index.html: имеет главную страницу с классом страницы, который прекрасно исчезает

gallery.html:

<section class="page">
    <div class="gallery">

        <div class="image" id="beeFace"></div>

        <div class="image" id="honeyComb"></div>

        <div class="image" id="pollen"></div>

        <div class="image" id="closeUp"></div>

        <div class="image" id="nectar"></div>

        <div class="image" id="hover"></div>

    </div>
</section>

javascript:

function wrapperFunction() {
    const slides = document.querySelectorAll(".slide");
    const pages = document.querySelectorAll(".page");

    let current = 0; //page tracker

    function nextSlide(pageNumber) {
        const nextPage = pages[pageNumber];
        const currentPage = pages[current];
        const currentLeft = currentPage.querySelector(".beeImage #beeLeft");
        const currentRight = currentPage.querySelector(".beeImage #beeRight");


        const tl = new TimelineMax();

        tl.fromTo(currentLeft, 0.3, {y:"-10%"}, {y:"-100%"})
        .fromTo(currentRight, 0.3, {y:"10%"}, {y:"-100%"},"-=0.2")
        .fromTo(currentPage, 0.3, {opacity:1, pointerEvents:"all"}, {opacity:0, pointerEvents:"none"})
        .fromTo(nextPage, 0.3, {opacity:0, pointerEvents:"none"}, {opacity:1, pointerEvents:"all"})


        current = pageNumber;
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...