Can't get .delay ()
I have almost zero experience with jQuery, so here it goes ... I've done a lot of research already, but I just can't figure out what I'm doing wrong ...
I want the two DIVs to disappear one after the other, but with a delay between the first and the second. This is what I have so far:
<script type="text/javascript">
$(document).ready(function(){
$("div.1").hide();
$("div.2").hide();
$("div.1").fadeIn(400);
$("div.2").delay(800).fadeIn(400);
});
</script>
<div class="1">
This is DIV1</div>
<div class="2">
This is DIV2</div>
I really hope you guys can help me! Thanks in advance:)
In jQuery 1.4, a method was added . delay, so if you are loading jQuery 1.3 as you point out in the comment, then your problem is. Your code should work correctly as written with 1.4 or newer.
you need to use callback functions like so:
("div.1").fadeIn(400, function() {$("div.2").delay(800).fadeIn(400);});
so fade in div.2
will be triggered after completion div.1
fadeIn
without delay
("div.1").fadeIn(400, function() {$("div.2").fadeIn(400);});