How do we Re-initialise the Webflow JS?

Design help Custom code
1

Hi Everyone,

I’ve been unable to find a guide to jump-starting the Webflow Interactions JS after other Ajax events have happened on the page… help! There have been some good answers provided by users like @mastermindesign and @danro leading to using script like this to re-initialise the WF JS after another event…

    <script>
  var Webflow = Webflow || [];
  Webflow.push(function() {
    // IX 2 Fix for loading animations when the site loads
    $('html').attr('data-wf-page', 'YOUR-OWN-WF-PAGEID');
    window.Webflow && window.Webflow.destroy();
    window.Webflow && window.Webflow.ready();
    window.Webflow && window.Webflow.require('ix2').init();
    document.dispatchEvent(new Event('readystatechange'));

    // IX 2 Fix for if you have different interactions at different breakpoints
    var resizeTimer;
    $(window).on('resize', function(e) {
      clearTimeout(resizeTimer);
      resizeTimer = setTimeout(function() {
        //When the page is resized re-start animations
        document.dispatchEvent(new Event('readystatechange'));
      }, 500);
    });
  });
</script>

But I haven’t the skill to know how to implement this and get it working. Seems like it should be a simple enough request, calling the Webflow script to reinitialise… but topics like this on the subject suggest folks are having mixed results… https://discourse.webflow.com/t/reinitialize-webflow-ix2/51094/45

So can anyone explain to a JS novice like me where we should put such a script and get it to work, or show examples of sites you’ve been able to restart the Webflow script successfully yourself?

For some added context, I use WF as a page builder mostly, and the site I build into has an ajax product grid, and with infinite scrolling it means the dom is extended dynamically by ajax… but the animations I have working on the products in the grid which load the webflow js with the page, do not work on the products added dynamically to the grid by the other js on the page. So, like others here, I need to understand how to re-trigger the webflow script to apply to everything on the page after new content loads.

Please Help,
Thanks

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

2

@SoftlySoftly Did you have any luck with this by any chance?