jQuery Effects

Primary tabs

Tim Bottman's picture

The jQuery library provides several techniques for adding animation to a web page. Use these flashcards to familiarize yourself with these effects.

Bookmark to learn: Login to use bookmarks.

Statistics

'Repetition is the mother of all learning.'

Bookmark to learn: Login to use bookmarks.

Add to collection ... add jQuery Effects to your collections:

Help using Flashcards ...just like in real life ;)

  1. Look at the card, do you know this one? Click to flip the card and check yourself.
  2. Mark card Right or Wrong, this card will be removed from the deck and your score kept.
  3. At any point you can Shuffle, Reveal cards and more via Deck controls.
  4. Continue to reveal the wrong cards until you have correctly answered the entire deck. Good job!
  5. Via the Actions button you can Shuffle, Unshuffle, Flip all Cards, Reset score, etc.
  6. Come back soon, we'll keep your score.
    “Repetition is the mother of all learning.”
  7. Signed in users can Create, Edit, Import, Export decks and more!.

Bookmark to learn: Login to use bookmarks.

Share via these services ...

Email this deck:

Right: #
Wrong: #
# Right & # Wrong of #

.animate()

Perform a custom animation of a set of CSS properties.

.clearQueue()

Remove from the queue all items that have not yet been run.

.delay()

Set a timer to delay execution of subsequent items in the queue.

.dequeue()

Execute the next function on the queue for the matched elements.

.fadeIn()

Display the matched elements by fading them to opaque.

.fadeOut()

Hide the matched elements by fading them to transparent.

.fadeTo()

Adjust the opacity of the matched elements.

.fadeToggle()

Display or hide the matched elements by animating their opacity.

.finish()

Stop the currently-running animation, remove all queued animations, and complete all animations for the matched elements.

.hide()

Hide the matched elements.

.queue()

Show or manipulate the queue of functions to be executed on the matched elements.

.show()

Display the matched elements.

.slideDown()

Display the matched elements with a sliding motion.

.slideToggle()

Display or hide the matched elements with a sliding motion.

.slideUp()

Hide the matched elements with a sliding motion.

.stop()

Stop the currently-running animation on the matched elements.

.toggle()

Display or hide the matched elements.