[Summary view] [Print] [Text view]

   1  $(document).ready(function() {
   2  
   3      $("div.effect")
   4          .hover(function() {
   5              $(this).addClass("hover");
   6          }, function() {
   7              $(this).removeClass("hover");
   8          })
   9          ;
  10  
  11  
  12      var effect = function(el, n, o) {
  13  
  14          $.extend(o, {
  15              easing: "easeOutQuint"
  16          });
  17  
  18          $(el).bind("click", function() {
  19  
  20              $(this).addClass("current").hide(n, o, 1000, function() {
  21                  var self = this;
  22                  window.setTimeout(function() {
  23                      $(self).show(n, o, 1000, function() { $(this).removeClass("current"); });
  24                  },500);
  25              });
  26          });
  27  
  28      };
  29  
  30  
  31      effect("#blindHorizontally", "blind", { direction: "horizontal" });
  32      effect("#blindVertically", "blind", { direction: "vertical" });
  33  
  34      effect("#bounce3times", "bounce", { times: 3 });
  35  
  36      effect("#clipHorizontally", "clip", { direction: "horizontal" });
  37      effect("#clipVertically", "clip", { direction: "vertical" });
  38  
  39      effect("#dropDown", "drop", { direction: "down" });
  40      effect("#dropUp", "drop", { direction: "up" });
  41      effect("#dropLeft", "drop", { direction: "left" });
  42      effect("#dropRight", "drop", { direction: "right" });
  43  
  44      effect("#explode9", "explode", {  });
  45      effect("#explode36", "explode", { pieces: 36 });
  46  
  47      effect("#fold", "fold", { size: 50 });
  48  
  49      effect("#highlight", "highlight", {  });
  50  
  51      effect("#pulsate", "pulsate", { times: 2 });
  52  
  53      effect("#puff", "puff", { times: 2 });
  54      effect("#scale", "scale", {  });
  55  
  56      $("#shake").bind("click", function() { $(this).addClass("current").effect("shake", {}, 100, function() { $(this).removeClass("current"); }); });
  57  
  58      effect("#slideDown", "slide", { direction: "down" });
  59      effect("#slideUp", "slide", { direction: "up" });
  60      effect("#slideLeft", "slide", { direction: "left" });
  61      effect("#slideRight", "slide", { direction: "right" });
  62  
  63      $("#transfer").bind("click", function() { $(this).addClass("current").effect("transfer", { to: "div:eq(0)" }, 1000, function() { $(this).removeClass("current"); }); });
  64  
  65  });