locomotivemtl / locomotive-boilerplate

🚂 Front-end boilerplate for projects by Locomotive.
https://locomotivemtl-boilerplate.vercel.app/
MIT License
455 stars 71 forks source link

is-loading class on html when following external links #176

Closed iamluxan closed 1 week ago

iamluxan commented 3 weeks ago

Hello,

I am using the famous Locomotive boilerplate for the first time to start a project, but I am facing a small issue. I am using the “modularload” module that you included in this boilerplate to create transitions during page loading.

I animate my transitions when html.is-loading is displayed and hide them when html.is-loaded appears.

However, if the user clicks on a link that points to an external site, html.is-loading gets this class. I then have an animation that starts to appear on the screen, only to be cut off midway and replaced by the external site.

Am I using it incorrectly, or have you planned to handle this behavior differently?

Thank you!

https://github.com/locomotivemtl/locomotive-boilerplate/assets/1712625/80c2423a-2e98-49d3-af95-b33bd1e7c20b

devenini commented 1 week ago

Hey, you can put the attribute data-load="false" on your external <a> tag. This will prevent modularLoad of doing a page transition