Popstate не будет работать с анимацией перехода страницы - PullRequest
0 голосов
/ 07 декабря 2018

Я использую api Fetch с anime.js, проблема в кнопках назад и вперед, я не могу включить анимацию и правильно удалить старый контейнер и добавить новый ...

function fetchPage (ссылка, страница) {let baseURL = ${window.location.protocol}//${window.location.hostname};

if (window.location.port) {
    baseURL += `:${window.location.port}`;
}

fetch(`${baseURL}/${page}`)
    .then(function(response) {
        return response.text()
    })
    .then(function(html) {
        let doc = new DOMParser().parseFromString(html, "text/html");

        anime({
            targets: '.big-text, .big-text__title',
            translateX: 500,
            opacity: [1,0],
            easing: 'easeInExpo',
            duration: 500,
            complete: (anim) => {
                document.querySelector('.column-wrapper').remove();
            }
        })

        setTimeout(function () {
            document.querySelector('body').insertBefore(doc.querySelector('.new-content'),null);
                $.getScript('js/separated.js');

                anime({
                targets: '.big-text, .big-text__title',
                translateX: [-500, 0],
                delay: (el, i) => 100 * i,
                opacity: [0, 1],
                easing: 'easeOutExpo',
            })


        }, 700);
    })


  window.addEventListener('popstate', function(){
          fetchPage(baseURL, location.pathname);  

})

}

...