Skip to main content

Bug Tracker

Side navigation

#4660 closed enhancement (worksforme)

Opened May 14, 2009 09:58PM UTC

Closed October 12, 2011 04:19AM UTC

fadeTo() does not fade-in elements after hide() or fadeOut() is called on them

Reported by: zachstronaut Owned by: timmywil
Priority: low Milestone: 1.7
Component: effects Version: 1.3.2
Keywords: fade,fadeOut,hide,fadeTo,1.7-discuss Cc:
Blocked by: Blocking:
Description

If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity.

You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old.

The fadeTo() method could be patched to do this on its own:

(function ($) {

var proxied = $.fn.fadeTo;

$.fn.fadeTo = function() {

if ($(this).is(':hidden')) {

$(this).css('opacity', 0).show();

}

return proxied.apply(this, arguments);

}

})(jQuery);

Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.

Attachments (0)
Change History (20)

Changed October 30, 2009 11:35PM UTC by mofle comment:1

This should really be fixed for 1.4.

Changed March 23, 2010 07:29PM UTC by mattlunn comment:2

Wow... 10 months. This is old, tiring, and not very clean!

1.4 was out looooong ago :(

Changed October 23, 2010 10:42PM UTC by SlexAxton comment:3

milestone: 1.41.5
priority: minorlow
status: newopen

Changed April 16, 2011 11:36PM UTC by john comment:4

milestone: → 1.next

We should look at fixing this properly in 1.7.

Changed May 22, 2011 07:27PM UTC by john comment:5

keywords: fade, fadeOut, hide, fadeTofade,fadeOut,hide,fadeTo,1.7-discuss

Nominating ticket for 1.7 discussion.

Changed May 22, 2011 10:01PM UTC by dmethvin comment:6

+1, Seems like .fadeTo() should show hidden elements, shouldn't have back-compat issues.

Changed May 22, 2011 10:28PM UTC by rwaldron comment:7

description: If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity. \ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old. \ \ The fadeTo() method could be patched to do this on its own: \ \ (function ($) { \ var proxied = $.fn.fadeTo; \ $.fn.fadeTo = function() { \ if ($(this).is(':hidden')) { \ $(this).css('opacity', 0).show(); \ } \ \ return proxied.apply(this, arguments); \ } \ })(jQuery); \ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity.\ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old.\ \ The fadeTo() method could be patched to do this on its own:\ \ (function ($) {\ var proxied = $.fn.fadeTo;\ $.fn.fadeTo = function() {\ if ($(this).is(':hidden')) {\ $(this).css('opacity', 0).show();\ }\ \ return proxied.apply(this, arguments);\ }\ })(jQuery);\ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.

+1, Seems obvious

Changed May 22, 2011 11:47PM UTC by jaubourg comment:8

+1, Looks like a bug to me.

Changed May 23, 2011 01:47AM UTC by ajpiano comment:9

description: If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity.\ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old.\ \ The fadeTo() method could be patched to do this on its own:\ \ (function ($) {\ var proxied = $.fn.fadeTo;\ $.fn.fadeTo = function() {\ if ($(this).is(':hidden')) {\ $(this).css('opacity', 0).show();\ }\ \ return proxied.apply(this, arguments);\ }\ })(jQuery);\ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity. \ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old. \ \ The fadeTo() method could be patched to do this on its own: \ \ (function ($) { \ var proxied = $.fn.fadeTo; \ $.fn.fadeTo = function() { \ if ($(this).is(':hidden')) { \ $(this).css('opacity', 0).show(); \ } \ \ return proxied.apply(this, arguments); \ } \ })(jQuery); \ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.

+1,

Changed May 23, 2011 02:47AM UTC by timmywil comment:10

description: If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity. \ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old. \ \ The fadeTo() method could be patched to do this on its own: \ \ (function ($) { \ var proxied = $.fn.fadeTo; \ $.fn.fadeTo = function() { \ if ($(this).is(':hidden')) { \ $(this).css('opacity', 0).show(); \ } \ \ return proxied.apply(this, arguments); \ } \ })(jQuery); \ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity.\ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old.\ \ The fadeTo() method could be patched to do this on its own:\ \ (function ($) {\ var proxied = $.fn.fadeTo;\ $.fn.fadeTo = function() {\ if ($(this).is(':hidden')) {\ $(this).css('opacity', 0).show();\ }\ \ return proxied.apply(this, arguments);\ }\ })(jQuery);\ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.

+1,

Changed May 23, 2011 03:22PM UTC by danheberden comment:11

+1

Changed June 03, 2011 01:09PM UTC by john comment:12

+1, Seems like we could just make sure it's visible before animating.

Changed June 03, 2011 02:11PM UTC by scottgonzalez comment:13

+1

Changed June 04, 2011 10:17PM UTC by addyosmani comment:14

+1

Changed June 06, 2011 03:36PM UTC by jzaefferer comment:15

+1

Changed June 06, 2011 03:45PM UTC by cowboy comment:16

+1

Changed July 11, 2011 07:10PM UTC by ajpiano comment:17

description: If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity.\ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old.\ \ The fadeTo() method could be patched to do this on its own:\ \ (function ($) {\ var proxied = $.fn.fadeTo;\ $.fn.fadeTo = function() {\ if ($(this).is(':hidden')) {\ $(this).css('opacity', 0).show();\ }\ \ return proxied.apply(this, arguments);\ }\ })(jQuery);\ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.If you call $('#foo').hide() or $('#foo).fadeOut() then calling $('#foo').fadeTo(1000, 0.5) will NOT fade the element back in to 50% opacity. \ \ You must do $('#foo').css('opacity', 0).show().fadeTo(1000, 0.5) which gets kind of old. \ \ The fadeTo() method could be patched to do this on its own: \ \ (function ($) { \ var proxied = $.fn.fadeTo; \ $.fn.fadeTo = function() { \ if ($(this).is(':hidden')) { \ $(this).css('opacity', 0).show(); \ } \ \ return proxied.apply(this, arguments); \ } \ })(jQuery); \ \ Rather than proxy patching fadeTo() it would be nice if the method itself were patched in the jQuery library code.
milestone: 1.next1.7

Changed August 15, 2011 10:37PM UTC by gnarf comment:18

owner: → gnarf
status: openassigned

Changed September 22, 2011 02:02PM UTC by timmywil comment:19

owner: gnarftimmywil

picking this one up

Changed October 12, 2011 04:19AM UTC by timmywil comment:20

resolution: → worksforme
status: assignedclosed

Looks like this is already fixed. http://jsfiddle.net/timmywil/cdrYt/

Let's always have test cases in tickets. ;)