Web Development with jQuery®
Sliding Elements (^) ❘ 231 Sliding Elements jQuery also provides the ability to animate an element by sliding. Sliding in jQuery ...
(^232) ❘ CHAPTER 8 ANIMATION AND EASING EFFECTS { event.preventDefault(); if (!animating) { animating = true; var easing = $('se ...
Sliding Elements (^) ❘ 233 var easing = $('select#exampleAnimationEasing').val(); var duration = parseInt($('input#exampleAnimat ...
(^234) ❘ CHAPTER 8 ANIMATION AND EASING EFFECTS The preceding example repeats the logic of Example 8-1, swapping out show(), hid ...
Fading Elements (^) ❘ 235 background: yellow; border-radius: 4px; padding: 5px; margin: 0 0 10px 0 ; } The following script demo ...
(^236) ❘ CHAPTER 8 ANIMATION AND EASING EFFECTS { animating = false; } ); } } ); $('input#exampleAnimationToggle').click( functi ...
Custom Animation (^) ❘ 237 FIGURE 8-3 Custom Animation jQuery also provides an API that facilitates custom animation using the a ...
(^238) ❘ CHAPTER 8 ANIMATION AND EASING EFFECTS value='5000' min='100' max='10000' step='100' name='exampleAnimationDuration' id ...
Custom Animation (^) ❘ 239 duration, easing, function() { animating = false; } ); } } ); $('input#exampleAnimationShrink').click ...
(^240) ❘ CHAPTER 8 ANIMATION AND EASING EFFECTS FIGURE 8-4 When you click the Grow button, the animate() method animates a trans ...
Animation Options (^) ❘ 241 Although the animate() method is limited to animating numeric CSS properties, jQuery UI provides a j ...
(^242) ❘ CHAPTER 8 ANIMATION AND EASING EFFECTS ➤ (^) start function((promise) animation) —A callback function that is executed ...
Plugins Beyond making many scripting tasks much easier, jQuery also makes itself easy to extend with new functionality. This is ...
(^244) ❘ CHAPTER 9 PLUGINS <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> John Candy M ...
Writing a Plugin (^) ❘ 245 The following JavaScript provides a simple, to-the-point demonstration of how to use the jQuery Plugi ...
(^246) ❘ CHAPTER 9 PLUGINS movies.ready(); } ); The preceding code results in the screen shot that you see in Figure 9-1 when yo ...
Writing a Plugin (^) ❘ 247 $.fn.extend({ select : function() { // In a jQuery plugin; 'this' is already a jQuery ready object // ...
(^248) ❘ CHAPTER 9 PLUGINS Inspecting the Document Object Model In traditional JavaScript, HTML element objects have always had ...
Writing a Plugin (^) ❘ 249 It might seem redundant, but next I include the same CSS that you saw in Example 9-1 so that you can ...
(^250) ❘ CHAPTER 9 PLUGINS { // In a jQuery plugin; 'this' is already a jQuery ready object // Performing an operation like addC ...
«
9
10
11
12
13
14
15
16
17
18
»
Free download pdf