Timer with interval alert

Question

I have a jquery timer on my page that counts down from 10 to 0. At 5 seconds I want to show a warning message then at 0 seconds I want to show another message.

I have used the code below which will do the count down in the form field as well as give the alerts, however the countdown stops when the alerts show:

$(function(){
    var count = 10;
    countdown = setInterval(function(){
        $("#Exam_Timer").val(count + " seconds remaining!");
        if (count == 5) {
            alert('Only 5 Seconds Left');
        }   
        if (count == 0) {
            alert('Times Up')
        }
    count--;
    }, 1000);
});

Can someone let me know how I would restructure this so that the alerts do no stop the countdown?

I tried putting the alert into a separate function but that did not help. I have created a Fiddle:

http://jsfiddle.net/CQu7T/

Answer 1

You cant do this with alert as it stop scripts execution. However you can achieve this with jQuery UI dialogs. Check the following demo

Working Demo