Integrating external Javascript into webflow
I would like to fully understand how to implement javascript into my webflow site. I have a good understanding of how webflow works and have gone through all of the tutorials. This is what i would like to implement. https://codepen.io/artursopelnik/pen/MEKyRb
Questions:
- why doesn’t this work ?
- how can i target a specific element so that i can apply a javascript function ?
- Whats the difference between ID and Class to target an element ?
- am i missing something in my "
<script> [something here] </script>" ? - am i missing something in my "
<div> [ something here ] </div>?
This is what i do understand
- Javascript cant be hosted internally in webflow so we need to the script from an external source ( ie git, a cdn … whatever ). we can call that script via url as like an image … cool. how do i know its pulling ?
- custom code can happen at page level and site level, how do you know what level to implement on ?
- i need halp
My end goal is to be able to understand this example well enough that i can implement other javascript libraries and work with them while doing the majority of my layout within webflow. I have a portfolio page that i want to implement and i have roughed out in sketch just super baffled. after a few days reading like a madman i thought id reach out.
Resources used :
- JavaScript Where To
- Integrate code from codepen
- How do I create a div id rather than class
- Target elements using ID as well as class, and by | Webflow Wishlist
- GitHub - juliangarnier/anime: JavaScript animation engine
Current example
https://preview.webflow.com/preview/particles-js-78fbd4?utm_source=particles-js-78fbd4&preview=73d2c3132dfaf0b9ff170d7a57acdc35