How to execute a script after an external asynchronous script in header tag completes execution?

Question

With Webflow native custom code editor, I added to my website an external script made by Finsweet inside the <head> tag, as they instruct to do.

I want to make some changes in the page with my own script after the execution of Finsweet's one but I'm limited by my knowledge in asynchrous JavaScript and use of JavaScript in HTML code.

Here is what it looks like:

<!-- [Attributes by Finsweet] CMS Slider -->
<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsslider@1/cmsslider.js"></script>
<script>
  // my own script
</script>

Putting my own script before the closing </body> tag is still not enough to allow the external script to fully execute.

I want a clean solution that avoids using a timer, knowing that I'm also limited by Webflow's environment.

I suppose you can refer to this - stackoverflow.com/questions/45869839/… — collab-with-tushar-raj
– collab-with-tushar-raj, Commented Jan 8, 2024 at 23:05

Anass igli · Accepted Answer · 2024-01-09 15:22:05Z

0

First of all, F'insweet code tags should be placed in your header tag (according to their Docs).

If you want to ensure that your custom script starts executing only after F'insweet's script, you can add the defer attribute to the F'insweet end of script tag as so :

<script async src="https://cdn.jsdelivr.net/npm/@finsweet/attributes-cmsslider@1/cmsslider.js" defer ></script>

Hope this helps!

answered Jan 9, 2024 at 15:22

Anass igli

564 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to execute a script after an external asynchronous script in header tag completes execution?

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related