加载页面后如何调用函数自动执行

Question

I'm trying to create a slider dynamically with jQuery. I'm using an example from http://imageslidermaker.com/v2 , and have downloaded the source and copied to my js and css folders.

My code:

<link rel="stylesheet" href="../css/my-slider.css"/>
<script src="../js/ism-2.0.1-min.js"></script>

        <div class="ism-slider" data-transition_type="fade" data-play_type="loop">
              <ul>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-1.jpg" class="ism-img-Imgs"></li>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-2.jpg" class="ism-img-Imgs"></li>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-3.jpg" class="ism-img-Imgs"></li>
                    <li class="ism-slide-Imgs"><img src="../img/PuntaPalma/Suits-2.jpg" class="ism-img-Imgs"></li>
              </ul>
            </div>

with this example the js works fine, but when I try to dynamically add the images, the js does not work.

<div class="ism-slider" data-transition_type="fade" data-play_type="loop">
  <ul>
    <!--li append from jQuery ajax-->
  </ul>
</div>

Then I open the js and I see that it has a function auto execute, so the question is: How to do to execute the function that is inside of js after the page has loaded?

Answer 1

Use onload. Since you are using jq:

$(window).load(function () {
    // do stuff
});

---

I took a look at this slideshow library, and found this which might be of interest to you:

<script>
    window.ISMConfig = {no_instantiation:true};
</script>
<script src="/ism/js/ism-2.0.1-min.js?v=150717"></script>

Answer 2

Not seeing your js source, there's a very simple jQuery method for it:

$(document).ready(function(){ ... });

As soon as the document is finished loading, any functions pushed to the ready stack via this method will be called.