Streaming live at 10am (PST)

JS event for assets loaded


#1

Hi all

I'm wondering if there's a way to have some custom code fire when assets are loaded, so that I can keep things in sync with the Webflow interactions.

It seems like

var Webflow = Webflow || [];
Webflow.push(function () {
});

only works for the DOM and Webflow object being ready. Is there a different queue for "assets loaded"?

I thought of a hacky workaround where I listen for a DOM change that's caused by a load trigger interaction, but hoping there's a cleaner way!


#2

http://imagesloaded.desandro.com

<script>
var Webflow = Webflow || [];
Webflow.push(function() {
  $.getScript('https://npmcdn.com/imagesloaded@4.1.0/imagesloaded.pkgd.min.js', function() {
    $(document).imagesLoaded(function() {
      // images have loaded
    });
  });
});
</script>

#3

Oh ok, is this what Webflow is using? @samliew

I'll give it a test but if "Wait for assets to load" includes webfonts my animations will still be out of sync...


#4

That's to wait for images to load, but if you are referring to font files, I'm not too sure what you can do for those.


#5

Fair enough, I guess I'll make do with imagesLoaded then. Thanks for your help!


#6