Crumpy Posted May 13 Share Posted May 13 I'd like to apply a 2-second delay for when a couple text boxes load onto the page. How do I have a 2-second delay applied to the circled blocks? #block-yui_3_17_2_1_1712594122466_4852 #block-yui_3_17_2_1_1712937226300_14646 Thank you! Link to comment
Beyondspace Posted May 13 Share Posted May 13 15 hours ago, Crumpy said: I'd like to apply a 2-second delay for when a couple text boxes load onto the page. How do I have a 2-second delay applied to the circled blocks? #block-yui_3_17_2_1_1712594122466_4852 #block-yui_3_17_2_1_1712937226300_14646 Thank you! Can you share your URL so I can take a look? BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox, video lightbox and much more) 🗓️ Delivery Date Picker (Squarespace Date picker form field) 💫 Gallery block 7.1 workaround 🥳 No-code customisations for Squarespace (+100 Spark plugin customisations) 🥳 Freemium Squarespace Widget Templates (+1000 Elfsight Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
Crumpy Posted May 13 Author Share Posted May 13 Here's the URL: https://blue-cow-nyej.squarespace.com/config/?password=pass Link to comment
Solution Beyondspace Posted May 13 Solution Share Posted May 13 (edited) Try the following Css #block-yui_3_17_2_1_1712594122466_4852,#block-yui_3_17_2_1_1712937226300_14646 { animation: 0.5s fadeIn; animation-fill-mode: forwards; animation-delay: 2s; visibility: hidden; opacity: 0; } @keyframes fadeIn { 0% { opacity: 0; visibility: hidden; } 100% { opacity: 1; visibility: visible; } } This is just a basic approach that is not efficient in case you set the effect on not-in-view elements. The javascript can make it work better (only when the element is in viewpoint, it runs this effect Edited May 14 by Beyondspace Crumpy 1 BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox, video lightbox and much more) 🗓️ Delivery Date Picker (Squarespace Date picker form field) 💫 Gallery block 7.1 workaround 🥳 No-code customisations for Squarespace (+100 Spark plugin customisations) 🥳 Freemium Squarespace Widget Templates (+1000 Elfsight Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
Crumpy Posted May 15 Author Share Posted May 15 Thank you so much, Beyondspace! Beyondspace 1 Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment