如何使我的函数在页面运行时立即运行？

Question

I would like to make a function run the moment a person loads my page. No interactivity. The function is loading when someone clicks. I also would like to make the function loop after 1 minute and a half. I tried replacing "click" for window.onload and body.onload but as you may have noticed by now I am a true begginer with javascript. Can someone give me a hand please. For now all I have is this:

 // Animate an element by adding a class to it: // Paramaters: // anim: the class name to add // time: animation duration (optional, fallsback to the class) // cb: an optional callback function to happen once the animation ends $.fn.animatecss = function(anim, time, cb) { if (time) this.css('-webkit-transition', time / 1000 + 's'); this.addClass(anim); if ($.isFunction(cb)) { setTimeout(function() { // Ensure that the element is available inside the callback. $(this).each(cb); }, (time) ? time : 5000); } return this; }; $(document).ready(function() { $('.box')click(function() { $(this).animatecss('blur-out', 5000, function() { console.log('callback'); }); }); }); 

 .blur-out { -webkit-filter: blur(8px); -webkit-transform: scale(1.4, 1.4); -webkit-transition: all 5s ease-out; transition: all 5s ease-out; visibility: hidden; } .box { background:#fff; margin: 80px; padding: 20px; } 

 <div class="box"> <img src="http://companionplants.com/images/small-plant2.jpg"> </div> 

Answer 1

$(document).ready(function() {
    $('.box').click(function() {
        $(this).animatecss('blur-out', 5000, function() {
            console.log('callback');
        });
    });

    // add this line
    $('.box').trigger('click');
});

Reference: http://api.jquery.com/trigger/

Answer 2

If I understood correctly, You want to start animation automatically after page is loaded.

Remove event handler for click. Leave code for animation like this:

 $(document).ready(function() { $('.box').animatecss('blur-out', 5000, function() { console.log('callback'); }); }); 

For automatically repeating this code, you need to place this code in recursive function with settimeout().

 $(document).ready(function() { function animate(){ $('.box').animatecss('blur-out', 5000, function() { console.log('callback'); }); setTimeout( animate(), 60000); } animate(); }); 

I hope that there are no errors, I cann't check it now, but I think it will help you