Tag: 交叉淡入淡出

jQuery：消除动画之间的白屏“暂停”

我刚刚发现Barba.js并发现它非常有用。 它提供了同一网站的URL之间的平滑过渡。 在jQuery的fadeIn()和fadeOut()方法的帮助下，我整理了一个由两个页面（index.html和about.html）组成的Plunker ，它们可以顺利加载。 $(document).ready(function() { var transEffect = Barba.BaseTransition.extend({ start: function() { this.newContainerLoading.then(val => this.fadeInNewcontent($(this.newContainer))); }, fadeInNewcontent: function(nc) { nc.hide(); var _this = this; $(this.oldContainer).fadeOut(1000).promise().done(() => { nc.css(‘visibility’, ‘visible’); nc.fadeIn(1000, function() { _this.done(); }); $(‘html, body’).animate({ scrollTop: 300 },1000); }); } }); Barba.Pjax.getTransition = function() { return transEffect; } Barba.Pjax.start(); }); 这个动画的问题是它们之间有一个白屏间隔 。 我怎样才能消除这个间隔，使过渡更平滑？ […]