[Summary view] [Print] [Text view]

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