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 comment:1
Changed March 23, 2010 07:29PM UTC by 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 comment:3
| milestone: | 1.4 → 1.5 |
|---|---|
| priority: | minor → low |
| status: | new → open |
Changed April 16, 2011 11:36PM UTC by comment:4
| milestone: | → 1.next |
|---|
We should look at fixing this properly in 1.7.
Changed May 22, 2011 07:27PM UTC by comment:5
| keywords: | fade, fadeOut, hide, fadeTo → fade,fadeOut,hide,fadeTo,1.7-discuss |
|---|
Nominating ticket for 1.7 discussion.
Changed May 22, 2011 10:01PM UTC by comment:6
+1, Seems like .fadeTo() should show hidden elements, shouldn't have back-compat issues.
Changed May 22, 2011 10:28PM UTC by 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 comment:8
+1, Looks like a bug to me.
Changed May 23, 2011 01:47AM UTC by 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 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 comment:11
+1
Changed June 03, 2011 01:09PM UTC by comment:12
+1, Seems like we could just make sure it's visible before animating.
Changed June 03, 2011 02:11PM UTC by comment:13
+1
Changed June 04, 2011 10:17PM UTC by comment:14
+1
Changed June 06, 2011 03:36PM UTC by comment:15
+1
Changed June 06, 2011 03:45PM UTC by comment:16
+1
Changed July 11, 2011 07:10PM UTC by 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.next → 1.7 |
Changed August 15, 2011 10:37PM UTC by comment:18
| owner: | → gnarf |
|---|---|
| status: | open → assigned |
Changed September 22, 2011 02:02PM UTC by comment:19
| owner: | gnarf → timmywil |
|---|
picking this one up
Changed October 12, 2011 04:19AM UTC by comment:20
| resolution: | → worksforme |
|---|---|
| status: | assigned → closed |
Looks like this is already fixed. http://jsfiddle.net/timmywil/cdrYt/
Let's always have test cases in tickets. ;)
This should really be fixed for 1.4.