Skip to content

Instantly share code, notes, and snippets.

@ElemarJR
Created November 8, 2012 02:41
Show Gist options
  • Select an option

  • Save ElemarJR/4036260 to your computer and use it in GitHub Desktop.

Select an option

Save ElemarJR/4036260 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>Deferred Objects</title>
</head>
<body>
<p id="p1">This paragraph fadeOut in 1000ms</p>
<p id="p2">This paragraph fadeOut in 2000ms</p>
<button id="fadeOutButton">fade out now!</button>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$("#fadeOutButton").click(function () {
$('#fadeOutButton').attr('disabled', 'disabled');
var
promise1 = $('#p1').fadeOut(1000);
promise2 = $('#p2').fadeOut(2000);
promise3 = $.when(promise1, promise2)
.pipe(function () {
return $.when(
$('#p1').fadeIn(),
$('#p2').fadeIn());
});
promise3.done(function(){
$('#fadeOutButton').removeAttr('disabled');
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment