Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hey,
I got a little problem with my announcement bar. So I'm not using any specific apps for this as its all done manually through coding.
The issue is that my announcement bar doesn't have that proper pop-up animation as you load up the site. Instead, there's this empty spot above the header bar in which the announcement loads. So you basically see an empty space until it fully loads, which doesn't look very professional. I'd like for it to pop-up after 2-3 seconds of loading up the site rather than there to be an empty space.
If anyone can help me adjust that, I'd greatly appreciate it.
URL: jasaoslaj.com
The issue is much more visible on mobile which is what my site is primarily optimized for.
Thanks.
Add these codes to your CSS, hope it will work
.promo_banner-show .promo_banner {
transition: all 1s linear;
animation-delay: 2s;
}
No sorry, the empty space is still there
Then you need to use another animation library like AOS or Animate.css.
Thanks.
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025