Running a Javascript function after a certain time

Question

I am new to programming and javascript.

What I want to do : Javascript function running on pageload, in this case showVideo(). I want to run this function for a say 10 seconds and then move to the next function.

function(){ dostuff(); // dostuff for 10 seconds // now stop dostuff // donewstuff(); } <div class="wrapper"> <div class="screen" id="screen-1" data-video="vid/river.mp4"> <img src="img/bird.jpg" class="big-image" /> </div> <div class="screen" id="screen-2" data-video="vid/sim.mp4"> <img src="img/spider.jpg" class="big-image" /> </div> </div> </div> <script> $(function(){ var BV, videoPlayer, BV = new $.BigVideo(); BV.init(); showVideo(); BV.getPlayer(); function showVideo() { BV.show($('#screen-1').attr('data-video'),{ambient:true}); $('#screen-1').find('.big-image').transit({'opacity':0},500) setTimeout(function(){showVideo2},40000); } function showVideo2() { BV.show($('#screen-2').attr('data-video'),{ambient:true}); $('#screen-2').find('.big-image').transit({'opacity':0},500) }

I tried :

setTimeout(function(){showVideo2},40000)

but it did not work. Any ideas?

showVideo2 without () is just a function reference, not an executing call to the function. You either want setTimeout(showVideo2, 40000) which passes the function reference to setTimeout for calling later, or setTimeout(function(){ showVideo2() }, 40000) which passes the anonymous function by reference to setTimeout and when that anon func is executed it will in turn execute showVideo2. — ajp15243
– ajp15243, Commented Nov 18, 2014 at 19:50
Really the question should be titled "How do I run on function from another function after a certain amount of time". If you were truly running a function after one another you would need to use callbacks. — Scott Sword
– Scott Sword, Commented Nov 18, 2014 at 19:59

james · Accepted Answer · 2014-11-18 19:50:18Z

3

You didn't actually call the function. Try this:

setTimeout(function() { showVideo2(); }, 40000);

Note the () in showVideo2().

answered Nov 18, 2014 at 19:50

james

13.4k9 gold badges50 silver badges74 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Andreas Argelius · Accepted Answer · 2014-11-18 19:49:27Z

You can use setTimeout()

var stopped = false; setTimeout(function() { stopped = true; }, 10000); while (!stopped) { // Do stuff here. }

dmcqu314 · Accepted Answer · 2014-11-18 19:54:47Z

My guess is that you would like to invoke showVideo and then 40s later invoke showVideo2. What you have is close, however you are not invoking showVideo2 in your timeout.

You have two solutions that would fix it:

Change

 function showVideo() { BV.show($('#screen-1').attr('data-video'),{ambient:true}); $('#screen-1').find('.big-image').transit({'opacity':0},500) setTimeout(function(){showVideo2},40000); }

To either:

 function showVideo() { BV.show($('#screen-1').attr('data-video'),{ambient:true}); $('#screen-1').find('.big-image').transit({'opacity':0},500) setTimeout(showVideo2,40000); }

or:

 function showVideo() { BV.show($('#screen-1').attr('data-video'),{ambient:true}); $('#screen-1').find('.big-image').transit({'opacity':0},500) setTimeout(function(){showVideo2(); },40000); }

Without testing this should work. Please comment if you have any questions.

Collectives™ on Stack Overflow

Running a Javascript function after a certain time

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related