# Sequence of page.visual\_effect and page.replace\_html

**URL:** <https://www.ruby-forum.com/t/sequence-of-page-visual-effect-and-page-replace-html/160843>\
**Category:** Rails\
**Created:** [February 20, 2009, 7:46am UTC](https://www.ruby-forum.com/t/sequence-of-page-visual-effect-and-page-replace-html/160843 "2009-02-20T07:46:04Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![e\_deleflie](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/e/858c86/32.png) [@e\_deleflie](https://www.ruby-forum.com/u/e_deleflie)\
**Post date:** [February 20, 2009, 7:46am UTC](https://www.ruby-forum.com/t/sequence-of-page-visual-effect-and-page-replace-html/160843/1 "2009-02-20T07:46:04Z")

</div>

All,

I’ve got will\_paginate working with AJAX (using un-obstructive  
javascript, i.e. good for SEO). All good.

When the user clicks “Next \>\>”, I want the next page of results to  
fade in. But the problem seems to be (in the code below) that both  
page.replace\_html and page.visual\_effect get called at the same time.  
So the new div starts to fade in, then gets drawn completely (once the  
AJAX call has returned) … then drops back to whichever fade level it  
was up to, then keeps going.

page.replace\_html “classical”, :partial =\> ‘view\_summary’, :locals =\>  
{ :my\_files =\> @my\_files}  
page.visual\_effect :Opacity, “classical”, :from =\> 0.0, :to =\> 1.0,  
:duration =\> 3

Is there a way that I can hold off running page.visual\_effect until  
page.replace\_html has completed?

(BTW, havn’t had much luck with page.delay)

Etienne

---

<div class="post-metadata">

**Author:** ![e\_deleflie](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/e/858c86/32.png) [@e\_deleflie](https://www.ruby-forum.com/u/e_deleflie)\
**Post date:** [February 20, 2009, 8:30am UTC](https://www.ruby-forum.com/t/sequence-of-page-visual-effect-and-page-replace-html/160843/2 "2009-02-20T08:30:31Z")

</div>

Have you tried hiding the div right after you page.replace\_html, then  
using page.visual\_effect :Appear?

Here’s an example of how I update my comment list with the same effect.

page.replace\_html ‘comments’, :partial =\> ‘blog/comment’, :collection =\>  
@comments  
page.hide ‘comment\_’ + @comment.id  
page.visual\_effect :Appear, ‘comment\_’ + @comment.id

---

<div class="post-metadata">

**Author:** ![e\_deleflie](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/e/858c86/32.png) [@e\_deleflie](https://www.ruby-forum.com/u/e_deleflie)\
**Post date:** [February 20, 2009, 9:46am UTC](https://www.ruby-forum.com/t/sequence-of-page-visual-effect-and-page-replace-html/160843/3 "2009-02-20T09:46:15Z")

</div>

Hi Aaron,

yeah, for some reason Appear seems to work much better than the Opacity  
effect.

The only issue I have now is that the whole page jumps around when I  
hide the Div … I have to find some way of keeping its size when  
hiding … urgh… css.

Etienne