javascript - sleep between functions

Question

how to execute sleep function inside a loop:

async function show(){
   showdiv()
   await sleep(5000)
   hideDiv()
   await sleep(5000)
}

function showDiv(){
   $('div').fadeIn()
}

function hideDiv(){
   $('div').fadeOut()
}

function sleep(second){
     return new Promise(resolve => setTimeout(resolve, second));
}

    var i = 0

    while(i++<10){
       show()
    }

How excatly i can excute the sleep function ?

I search here but didn't found something relevant or didn't understand it.

Please help!

Answer 1

What you are looking for is setTimeout function.

var timeoutID;

function delayedAlert() {
  timeoutID = window.setTimeout(slowAlert, 2000);
}

function slowAlert() {
  alert("That was really slow!");
}

function clearAlert() {
  window.clearTimeout(timeoutID);
}

<input type="button" onclick="delayedAlert()" value="Click me for Delay" />