Created
December 23, 2011 04:35
-
-
Save dmonopoly/1513155 to your computer and use it in GitHub Desktop.
How do you convert this animate method of jQuery to CoffeeScript?
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$('#book').animate({ | |
opacity: 0.25, | |
left: '+=50', | |
height: 'toggle' | |
}, 5000, function() { | |
// Animation complete. | |
}); |
I am a big fan of the clean style demonstrated by CSS Tricks. Currently my preference is to code more horizontally, so for instance I would write a 3-part .animate()
chain with callbacks like this:
$('#hero-section').animate height: '0px', paddingBottom: '0px', ->
$('#featured-content').animate opacity: '0', ->
$('.main-content-wrapper').animate paddingTop: '25vh'
Note: It should not be overlooked that jQuery is awesome and allows one to leave out the duration
parameter, which is normally the 2nd argument to .animate()
, as demonstrated in other examples online. The default behavior is to accept a callback function as the final parameter, so you don't actually have to include duration
if you don't want to.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
$('#book').animate
opacity: 0.25
left: '+=50'
height: 'toggle'
5000, ->
# Animation complete. ;)