Reputation: 6555
I want to create a delay between these two messages:
$('#submit-account').html(animation + 'Submitting Data')
$('#submit-account').html(animation + 'Validating Email')
I have tried this:
var ani = "<i class='icon-spin'></i> "
$('#submit-account').html(ani + 'Wait').delay(5000).fadeIn();
$('#submit-account').html(ani + 'Done').delay(10000).fadeIn();
But there is no delay, why?
Upvotes: 0
Views: 3011
Reputation: 6795
maybe you need to link JQuery 1.9.1, this is working: jsFiddle is here
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
and note that delay()
method is for delaying between queued jQuery effects.
take a look at this jsFiddle
Upvotes: 1
Reputation: 73
I'm not sure if i'm understanding it precisely or correct but there's a Default Built in JavaScript setTimeOut(); Function.
For more info :How to wait 5 seconds with jQuery?
Upvotes: 0
Reputation: 33495
I think that problem is because delay()
only delays item(s) in a queue (jQuery queues automatically only animations).
So try to modify fade function to fadeIn(0)
and jQuery will interpret it as animation and now delay should works.
Upvotes: 3
Reputation: 864
make sure the #submit-account is hidden already.
instead of your code you can try this
$('#submit-account').html(ani + "Wait").fadeIn(5000);
$('#submit-account').html(ani + "Done").fadeIn(5000);
This will control the speed of the fadein effect.
or if you want the div to be fadein after some time, you can use the setTimeOut()
function.
Hope this will help you
Upvotes: 1