dwz.effects.js 3.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. /**
  2. * @author Roger Wu
  3. */
  4. (function($){
  5. $.extend($.fn, {
  6. jBlindUp: function(options){
  7. var op = $.extend({duration: 500, easing: "swing", call: function(){}}, options);
  8. return this.each(function(){
  9. var $this = $(this);
  10. $(this).animate({height: 0}, {
  11. step: function(){},
  12. duration: op.duration,
  13. easing: op.easing,
  14. complete: function(){
  15. $this.css({display: "none"});
  16. op.call();
  17. }
  18. });
  19. });
  20. },
  21. jBlindDown: function(options){
  22. var op = $.extend({to:0, duration: 500,easing: "swing",call: function(){}}, options);
  23. return this.each(function(){
  24. var $this = $(this);
  25. var fixedPanelHeight = (op.to > 0)?op.to:$.effect.getDimensions($this[0]).height;
  26. $this.animate({height: fixedPanelHeight}, {
  27. step: function(){},
  28. duration: op.duration,
  29. easing: op.easing,
  30. complete: function(){
  31. $this.css({display: ""});
  32. op.call(); }
  33. });
  34. });
  35. },
  36. jSlideUp:function(options) {
  37. var op = $.extend({to:0, duration: 500,easing: "swing",call: function(){}}, options);
  38. return this.each(function(){
  39. var $this = $(this);
  40. $this.wrapInner("<div></div>");
  41. var fixedHeight = (op.to > 0)?op.to:$.effect.getDimensions($(">div",$this)[0]).height;
  42. $this.css({overflow:"visible",position:"relative"});
  43. $(">div",$this).css({position:"relative"}).animate({top: -fixedHeight}, {
  44. easing: op.easing,
  45. duration: op.duration,
  46. complete:function(){$this.html($(this).html());}
  47. });
  48. });
  49. },
  50. jSlideDown:function(options) {
  51. var op = $.extend({to:0, duration: 500,easing: "swing",call: function(){}}, options);
  52. return this.each(function(){
  53. var $this = $(this);
  54. var fixedHeight = (op.to > 0)?op.to:$.effect.getDimensions($this[0]).height;
  55. $this.wrapInner("<div style=\"top:-" + fixedHeight + "px;\"></div>");
  56. $this.css({overflow:"visible",position:"relative", height:"0px"})
  57. .animate({height: fixedHeight}, {
  58. duration: op.duration,
  59. easing: op.easing,
  60. complete: function(){ $this.css({display: "", overflow:""}); op.call(); }
  61. });
  62. $(">div",$this).css({position:"relative"}).animate({top: 0}, {
  63. easing: op.easing,
  64. duration: op.duration,
  65. complete:function(){$this.html($(this).html());}
  66. });
  67. });
  68. }
  69. });
  70. $.effect = {
  71. getDimensions: function(element, displayElement){
  72. var dimensions = new $.effect.Rectangle;
  73. var displayOrig = $(element).css('display');
  74. var visibilityOrig = $(element).css('visibility');
  75. var isZero = $(element).height()==0?true:false;
  76. if ($(element).is(":hidden")) {
  77. $(element).css({visibility: 'hidden', display: 'block'});
  78. if(isZero)$(element).css("height","");
  79. if ($.browser.opera)
  80. refElement.focus();
  81. }
  82. dimensions.height = $(element).outerHeight();
  83. dimensions.width = $(element).outerWidth();
  84. if (displayOrig == 'none'){
  85. $(element).css({visibility: visibilityOrig, display: 'none'});
  86. if(isZero) if(isZero)$(element).css("height","0px");
  87. }
  88. return dimensions;
  89. }
  90. }
  91. $.effect.Rectangle = function(){
  92. this.width = 0;
  93. this.height = 0;
  94. this.unit = "px";
  95. }
  96. })(jQuery);