Initializing Royal Slider after specific js function has run?

Christian's Avatar

Christian

15 May, 2017 11:21 AM

I have some JS in the head of my page for controlling the play state of CSS animations, which is:

<script>
      document.body.classList.add('js-loading');

      window.addEventListener("load", showPage);

      function showPage() {
        document.body.classList.remove('js-loading');
      }
    </script>

jQuery, along with my JS plugins and scripts are called in at the bottom before the closing body. Is there a way of initialising Royal Slider only once the showPage function has been completed? Or on detecting that no .js-loading class exists?

  1. Support Staff 1 Posted by Dmitry Semenov on 15 May, 2017 05:45 PM

    Dmitry Semenov's Avatar

    Hello,

    Sure, you may initialize slider anywhere, not just in document.ready:

           $(".royalSlider").royalSlider({
                // options go here
            });
    
  2. 2 Posted by Christian on 16 May, 2017 09:26 AM

    Christian's Avatar

    But if there a way of making it initialize only after the showPage function has completed? I don’t want to have to put jQuery and all my plugins in the head.

  3. Support Staff 3 Posted by Dmitry Semenov on 16 May, 2017 11:17 AM

    Dmitry Semenov's Avatar

    Not sure if I correctly understand your points.

    1. This is JS script, to initialize it - you need to load its JS file first. You can not initialize it before the royalslider.js file is loaded.
    2. window.load event fires after all images and scripts are loaded on a page, no matter if they're included in footer or header. So if you want to initialize slider in it - just do so.
  4. 4 Posted by Christian on 17 May, 2017 01:20 PM

    Christian's Avatar

    Ok thanks.

  5. Christian closed this discussion on 31 Jan, 2018 06:09 PM.

Comments are currently closed for this discussion. You can start a new one.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac