search

barbajs / barba

Create badass, fluid and smooth transitions between your website’s pages
https://barba.js.org/
MIT License
11.64k stars 474 forks source link

Issue with internal links, having to double click to initiate transition. #345

Closed cbmongithub closed 5 years ago

cbmongithub commented 5 years ago

I have an issue where barba will not immediately load the next page. It works. but the link takes a double click to register to the next page. When i click once, the url does change, but the page stays on the current page until another click has initiated the page transition. Here is my testing markup, nested inside my content div. It's happening to both pages. .... ....

.... .... Then my jquery, in my js file at the very top (outside of the brackets, of course) .... loader goes here .... $('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(); }) }); } }); Barba.Pjax.getTransition = function() { return transEffect; } Barba.Pjax.start(); }); ... nav js smooth scrolling js etc ...

I tried loading the barba script before anything else is executed, though i've tried putting the script in middle, bottom and switched scripts around on the actual index page, etc.

The header has jquery then barba, while footer scripts have main.js , tweenmax , scrolltotop plugin. I am getting NO console errors thrown. Everything otherwise is responsive, crisp, and technically sound.

This is likely a very minor issue, but i couldn't find the answer anywhere else. Thanks for any replies!

xavierfoucrier commented 5 years ago

Hi @christianbmartinez!

Do you have a codepen demo to reproduce the issue, properly debug and see what's happening? Thx :wink:

swatiparge commented 5 years ago

I am having same issue and i couldn't find the answer anywhere else.

thierrymichel commented 5 years ago

@christianbmartinez, @swatiparge Please, for questions on how to use barba.js, join the Slack channel… Some [ ] pen / [ ] bin / [ ] repo / [ ] url / … (check/delete as appropriate) to help reproducing the issue are warm welcomed!

luruke commented 5 years ago

I'm closing, if the problem persists, do not hesitate to open a new issue (with more informations) or join the slack channel