[jQuery] Re: combine slide and fade

[Christopher]

thx! both works nice!

On Wed, Feb 11, 2009 at 4:08 AM, mkmanning michaell...@gmail.com wrote:


 You could try this:
 jQuery.fn.slideFadeToggle = function(speed, easing, callback) {
return this.animate({opacity: 'toggle', height: 'toggle'}, speed,
 easing, callback);
 };

 On Feb 10, 12:31 pm, Paul Mills paul.f.mi...@gmail.com wrote:
  Hi Chris,
  It's a bit tricky trying to get 2 effects to run at the same time on
  the same jQuery selection. My approach would be to change the HTML
  mark up so that the 2 effects can be applied to different selections.
  So if you have some HTML like this:
buttonToggle/button
p id=text
span
  This is the content to be hidden and shown
span
/p
 
  You can apply the slide effect to the p and the fade to the span.
  JavaScript a bit like this:
  $(button).toggle(function () {
$(#text span).fadeOut(slow);
$(#text).slideUp(slow);
  },function() {
$(#text span).fadeIn(slow);
$(#text).slideDown(slow);
  });
 
  Hope that helps
  Paul

[jQuery] Re: combine slide and fade

[Paul Mills]

Hi Chris,
It's a bit tricky trying to get 2 effects to run at the same time on
the same jQuery selection. My approach would be to change the HTML
mark up so that the 2 effects can be applied to different selections.
So if you have some HTML like this:
  buttonToggle/button
  p id=text
  span
This is the content to be hidden and shown
  span
  /p

You can apply the slide effect to the p and the fade to the span.
JavaScript a bit like this:
$(button).toggle(function () {
  $(#text span).fadeOut(slow);
  $(#text).slideUp(slow);
},function() {
  $(#text span).fadeIn(slow);
  $(#text).slideDown(slow);
});

Hope that helps
Paul

[jQuery] Re: combine slide and fade

[mkmanning]

You could try this:
jQuery.fn.slideFadeToggle = function(speed, easing, callback) {
return this.animate({opacity: 'toggle', height: 'toggle'}, speed,
easing, callback);
};

On Feb 10, 12:31 pm, Paul Mills paul.f.mi...@gmail.com wrote:
 Hi Chris,
 It's a bit tricky trying to get 2 effects to run at the same time on
 the same jQuery selection. My approach would be to change the HTML
 mark up so that the 2 effects can be applied to different selections.
 So if you have some HTML like this:
   buttonToggle/button
   p id=text
   span
     This is the content to be hidden and shown
   span
   /p

 You can apply the slide effect to the p and the fade to the span.
 JavaScript a bit like this:
     $(button).toggle(function () {
       $(#text span).fadeOut(slow);
       $(#text).slideUp(slow);
     },function() {
       $(#text span).fadeIn(slow);
       $(#text).slideDown(slow);
     });

 Hope that helps
 Paul