tailieunhanh - jQuery in Action phần 7

Tham khảo tài liệu 'jquery in action phần 7', công nghệ thông tin, kỹ thuật lập trình phục vụ nhu cầu học tập, nghiên cứu và làm việc hiệu quả | Animating the display state of elements 135 Note that we no longer need the conditional statement to determine whether to hide or show the elements toggle takes care of swapping the displayed state. We still use the .is hidden test as part of a simpler ternary expression to determine the appropriate image to use for the item marker. Instantaneously making elements appear and disappear is handy but sometimes we want the transition to be less abrupt. Let s see what s available for that. Animating the display state of elements Human cognitive ability being what it is making items pop into and out of existence instantaneously can be jarring to us. If we blink at the wrong moment we could miss the transition leaving us to wonder What just happened Gradual transitions of a short duration help us know what s changing and how we got from one state to the other. And that s where the jQuery core effects come in of which there are three sets Show and hide there s a bit more to these commands than we let on in section Fade in and fade out Slide down and slide up Let s look more closely at each of these effect sets. Showing and hiding elements gradually The show hide and toggle commands are more complex than we led you to believe in the previous section. When called with no parameters these commands effect a simple manipulation of the display state of the wrapped elements causing them to instantaneously be revealed or hidden from the display. But when passed parameters these effects can be animated so that their changes in display status take place over a period of time. Now we re ready to look at the full syntaxes of these commands. 136 CHAPTER 5 Sprucing up with animations and effects Command syntax hide hide speed callback Causes the elements in the wrapped set to become hidden. If called with no parameters the operation takes place instantaneously by setting the display style property value of the elements to none. If a speed parameter is provided the elements