6 function effect( elem, name, options ) {
11 $( elem ).click(function() {
13 .addClass( "current" )
14 // delaying the initial animation makes sure that the queue stays in tact
16 .hide( name, options, duration )
18 .show( name, options, duration, function() {
19 $( this ).removeClass( "current" );
24 $( "#hide" ).click(function() {
26 .addClass( "current" )
29 .show( duration, function() {
30 $( this ).removeClass( "current" );
34 effect( "#blindLeft", "blind", { direction: "left" } );
35 effect( "#blindUp", "blind", { direction: "up" } );
36 effect( "#blindRight", "blind", { direction: "right" } );
37 effect( "#blindDown", "blind", { direction: "down" } );
39 effect( "#bounce3times", "bounce", { times: 3 } );
41 effect( "#clipHorizontally", "clip", { direction: "horizontal" } );
42 effect( "#clipVertically", "clip", { direction: "vertical" } );
44 effect( "#dropDown", "drop", { direction: "down" } );
45 effect( "#dropUp", "drop", { direction: "up" } );
46 effect( "#dropLeft", "drop", { direction: "left" } );
47 effect( "#dropRight", "drop", { direction: "right" } );
49 effect( "#explode9", "explode", {} );
50 effect( "#explode36", "explode", { pieces: 36 } );
52 effect( "#fade", "fade", {} );
54 effect( "#fold", "fold", { size: 50 } );
56 effect( "#highlight", "highlight", {} );
58 effect( "#pulsate", "pulsate", { times: 2 } );
60 effect( "#puff", "puff", { times: 2 } );
61 effect( "#scale", "scale", {} );
62 effect( "#size", "size", {} );
63 $( "#sizeToggle" ).click(function() {
64 var options = { to: { width: 300, height: 300 } };
66 .addClass( "current" )
67 .toggle( "size", options, duration )
69 .toggle( "size", options, duration, function() {
70 $( this ).removeClass( "current" );
74 $( "#shake" ).click(function() {
76 .addClass( "current" )
77 .effect( "shake", {}, 100, function() {
78 $( this ).removeClass( "current" );
82 effect( "#slideDown", "slide", { direction: "down" } );
83 effect( "#slideUp", "slide", { direction: "up" } );
84 effect( "#slideLeft", "slide", { direction: "left" } );
85 effect( "#slideRight", "slide", { direction: "right" } );
87 $( "#transfer" ).click(function() {
89 .addClass( "current" )
90 .effect( "transfer", { to: "div:eq(0)" }, 1000, function() {
91 $( this ).removeClass( "current" );
95 $( "#addClass" ).click(function() {
96 $( this ).addClass( "current", duration, function() {
97 $( this ).removeClass( "current" );
100 $( "#removeClass" ).click(function() {
101 $( this ).addClass( "current" ).removeClass( "current", duration );
103 $( "#toggleClass" ).click(function() {
104 $( this ).toggleClass( "current", duration );