Page Transition Delay Issue

Heya,

I’m creating an intro page for my portfolio using a transition animation that scales a white circle. I’ve found a few videos using this script in the footer:

Unfortunately, my site isn’t respecting the delay enabled by the script. The class name is correct.

Can see the site here. Once the initial animation loads, you can click on the circle and it should have a 10s delay before moving to the next page (10s just as a test, I’d like a 2-5s delay).

Thanks for any/all help!!!


Here is my site Read-Only: https://preview.webflow.com/preview/jamess-trendy-project-9fb4a2?utm_medium=preview_link&utm_source=designer&utm_content=jamess-trendy-project-9fb4a2&preview=f8ab1b56d2090b284a5892bb0f16a5ef&mode=preview

It doesn’t look like your script is running. I assume you are trying to do this with jquery,

  1. make sure jquery is loaded
  2. add your click function inside document ready event e.g. ```
    $(document).ready(function()

Thanks @Gail_Ranger!

I am reading in the docs that jquery should load with newly published sites… is there something I need to do to turn on?

" Important : As of March 1st, 2018, newly published Webflow sites include the latest version of jQuery (v3.3.1) . Previously, Webflow sites were published using jQuery v2.2.0."

Also, in this video it seems like the code as is works… where should I add the click function? Is that an attribute of the element in the designer?

Thanks for the help!!

I just tried using your code from screenshot and it worked for me (I applied your code to a button) . Does your class on the element match your code? Make sure the class name is the same as the output from Webflow.
E.g.
A class named ‘LinkBlock’ (in the designer) = ‘linkblock’ in the published html.
and
A class named ‘Link Block’ (in the designer) = ‘link-block’ in the published html.

Rightt! I didnt realize the html was lowercase. Thanks a ton!