Trouble with custom code for page transitions?

Hi,

So I’ve got this custom code added to the project in order to create some fun transition animations.
This is the code:

 <script>
function delay (URL) {
console.log(URL);
console.log(window.location);
setTimeout( function() { window.location = URL }, 1500 );
}
</script>

What it does is essentially delaying the effect of a button (going to another page), so the transition animation can play on the current page before moving to the next one.

The transitions works by having the nav buttons go to this url: `javascript:delay(‘/Pageslug’) instead of having the button go to a page.

So far this works great, except it has a few weird side effects:

  • Using the back button breaks the site transitions and the animation freezes. (firefox and safari)
  • Right clicking a button and opening it as a new tab doesn’t work and gives this url: about:blank#blocked (in chrome. In safari the option isn’t even there)
  • We’re also looking if it’s possible to create a ‘current page’ indicator, but haven’t found a way yet

Any ideas how we could fix this?

Thanks!

Here is my public share link: Sharelink

Published website link

1 Like

I seem to be running into the same problem. Any clues how to solve this?

Duplicate/repost of Page transition issues with custom code