Effects and Speed
When we include a speed with .show()
or .hide()
, it becomes animated—occurring over a specified period of time. The .hide('speed')
method, for example, will decrease an element’s height, width, and opacity simultaneously until all three reach zero, at which point the CSS rule display:none
is applied. The .show('speed')
method will increase the element’s height from top to bottom, width from left to right, and opacity from 0 to 1 until its contents are completely visible.
Speeding In
With any jQuery effect, we can use one of three speeds: slow
, normal
, and fast
. Using .show('slow')
would make the show effect complete in .6 seconds, .show('normal')
in .4 seconds, and .show('fast')
in .2 seconds. For even greater precision we can specify a number of milliseconds, for example .show(850)
. Unlike the speed names, the numbers are not wrapped in quotation marks.
Let’s include a speed in our example when showing the second paragraph of Lincoln’s Gettysburg Address:
$(document).ready...