Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/450.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Barba.js在wordpress中转换后将页面重新斜体化_Javascript_Jquery_Ajax_Wordpress_Barbajs - Fatal编程技术网

Javascript Barba.js在wordpress中转换后将页面重新斜体化

Javascript Barba.js在wordpress中转换后将页面重新斜体化,javascript,jquery,ajax,wordpress,barbajs,Javascript,Jquery,Ajax,Wordpress,Barbajs,我对wordpress中的barba.js有一个常见问题。我正在研究这个:还有这个例子。问题是,页面转换后的页面设计被分发,甚至上一页也被分发。我知道在stackoverflow和其他论坛上有很多关于这个问题的话题,并且有一些答案。我试图从中受益,结果总是一样的。我不知道是什么问题。首先我认为,可能是,页脚和页眉中的脚本和样式文件在转换后没有加载,但我看到它们在页面转换后加载。那么,如果在转换之后加载了所有内容,那么问题是什么呢。谁能帮帮我吗。我的javascript知识薄弱,而且我对ajax技

我对wordpress中的barba.js有一个常见问题。我正在研究这个:还有这个例子。问题是,页面转换后的页面设计被分发,甚至上一页也被分发。我知道在stackoverflow和其他论坛上有很多关于这个问题的话题,并且有一些答案。我试图从中受益,结果总是一样的。我不知道是什么问题。首先我认为,可能是,页脚和页眉中的脚本和样式文件在转换后没有加载,但我看到它们在页面转换后加载。那么,如果在转换之后加载了所有内容,那么问题是什么呢。谁能帮帮我吗。我的javascript知识薄弱,而且我对ajax技术还不熟悉。谢谢你的关注

document.addEventListener('DOMContentLoaded', function() {
var lastElementClicked;
    Barba.Pjax.init();
    Barba.Prefetch.init();
Barba.Dispatcher.on('linkClicked', function(el) {
    lastElementClicked = el;
  });
  
   var Body = Barba.BaseView.extend({
        namespace: '#barba-wrapper',
      sync: true,
        onEnter() {},
        onEnterCompleted() {},
        onLeave() {},
        onLeaveCompleted() {}
    });

    Body.init();
    
    var Homepage = Barba.BaseView.extend({
        namespace: 'homep',
      sync: true,
        onEnter() {},
        onEnterCompleted() {},
        onLeave() {},
        onLeaveCompleted() {}
    });

    Homepage.init();

    var About = Barba.BaseView.extend({
        namespace: 'aboutp',
      sync: true,
        onEnter() {},
        onEnterCompleted() {},
        onLeave() {},
        onLeaveCompleted() {}
    });

    About.init();
    
    var Newspress = Barba.BaseView.extend({
        namespace: 'newsp',
      sync: true,
        onEnter() {},
        onEnterCompleted() {},
        onLeave() {},
        onLeaveCompleted() {}
    });

    Newspress.init();
    
    var Tedbirler = Barba.BaseView.extend({
        namespace: 'tedbirlerp',
      sync: true,
        onEnter() {},
        onEnterCompleted() {},
        onLeave() {},
        onLeaveCompleted() {}
    });

    Tedbirler.init();

    var pageTransition = Barba.BaseTransition.extend({
        start: function() {
            this.newContainerLoading.then(
                val => this.fadeInNewcontent(this.newContainer, this.oldContainer)
            );
        },
        transitionFinished(newContainer, oldContainer) {
            newContainer.style.visibility = "visible";
            window.scrollTo(0, 0);
            this.done();
        },
        fadeInNewcontent: function(newContainer, oldContainer) {
            newContainer.classList.add('new');

            var _this = this;

            const transition = this.oldContainer.animate([
                { opacity: 1 }, 
                { opacity: 0 }
            ], {duration: 1500});

            transition.onfinish = function() {
                _this.transitionFinished(newContainer, oldContainer);
            };
        }
    });

    Barba.Pjax.getTransition = function() {
        return pageTransition;
    }

    Barba.Pjax.start();

}, false);

最好使用barba.jsv2-这个问题已经解决了吗?