How can I delay the Page Load 2 animation in Webflow by 1.5 seconds to avoid clashing with Page Load 1?
Published on
September 22, 2023
To delay the Page Load 2 animation in Webflow by 1.5 seconds to avoid clashing with Page Load 1, you can follow these steps:
- Select the element that you want to delay the animation for.
- In the right-hand sidebar, go to the "Settings" tab (the gear icon).
- Under the "Trigger" section, click on the "Add New Trigger" button.
- From the dropdown menu, select "Page Load."
- In the delay field, enter "1500" (milliseconds) to specify a delay of 1.5 seconds.
- Click outside the field to apply the delay.
By following these steps, you have delayed the Page Load 2 animation by 1.5 seconds. This delay will ensure that the animations won't clash with each other and will give the Page Load 1 animation enough time to complete before the Page Load 2 animation begins.
Note: This method works for delaying page load animations generally. If you want to delay specific elements within a page load animation, you can nest the delayed elements within their own div block and apply the delay to that block instead of the entire page load animation.
Additional Questions:
- How do I create page load animations in Webflow?
- Can I customize the timing and duration of page load animations in Webflow?
- What other trigger types can I use for Webflow animations, besides page load?