# Fade out and then fade in....how to make it work?

**URL:** <https://www.ruby-forum.com/t/fade-out-and-then-fade-in-how-to-make-it-work/78180>\
**Category:** Rails\
**Created:** [March 8, 2006, 1:53am UTC](https://www.ruby-forum.com/t/fade-out-and-then-fade-in-how-to-make-it-work/78180 "2006-03-08T01:53:33Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![beachguy82](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/b/9dc877/32.png) [@beachguy82](https://www.ruby-forum.com/u/beachguy82)\
**Post date:** [March 8, 2006, 1:53am UTC](https://www.ruby-forum.com/t/fade-out-and-then-fade-in-how-to-make-it-work/78180/1 "2006-03-08T01:53:33Z")

</div>

I’m trying to have one image fade out and then another slidedown upon  
completion of the ajax call. I can’t get the timing correct. How do  
you do it? Here’s what I’m trying (this does not work)  
\<%= link\_to\_remote(image\_tag(url\_for\_file\_column(product, “image\_url”),  
:update =\> ‘right\_content’,  
:url =\> { :action =\> :product\_details,  
:id =\> product.id },  
:loading =\> visual\_effect(:fade, “right\_content”, :duration =\>  
0.5 ),  
:complete =\> visual\_effect(:slideDown, “right\_content”,  
:duration =\> 0.5 )  
)%\>

---

<div class="post-metadata">

**Author:** ![beachguy82](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/b/9dc877/32.png) [@beachguy82](https://www.ruby-forum.com/u/beachguy82)\
**Post date:** [March 8, 2006, 2:07am UTC](https://www.ruby-forum.com/t/fade-out-and-then-fade-in-how-to-make-it-work/78180/2 "2006-03-08T02:07:13Z")

</div>

I"m getting closer but this still doesn’t work. It switches the images  
while the first fade effect is happening.

> \<%= link\_to\_remote(image\_tag(url\_for\_file\_column(product, “image\_url”),  
> :update =\> ‘right\_content’,  
> :url =\> { :action =\> :product\_details,  
> :id =\> product.id },  
> :before =\> visual\_effect(:fade, “right\_content”, :duration =\> 1.5, :queue =\> ‘front’),  
> :complete =\> visual\_effect(:appear, “right\_content”, :duration  
> =\> 0.5,:queue =\> ‘end’)  
> )%\>

---

<div class="post-metadata">

**Author:** ![beachguy82](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/b/9dc877/32.png) [@beachguy82](https://www.ruby-forum.com/u/beachguy82)\
**Post date:** [March 8, 2006, 3:15pm UTC](https://www.ruby-forum.com/t/fade-out-and-then-fade-in-how-to-make-it-work/78180/3 "2006-03-08T15:15:35Z")

</div>

Anyone know how to do this? Someone has got to know how to do this.

On Wed, 2006-03-08 at 02:07 +0100, charlie bowman wrote:

> 

Charlie B.  
Programmer  
Castle Branch Inc.