你可以将replace_html与Rails RJS中的visual_effect结合起来吗?

我正在开发一个使用Ruby on Rails的网站,我有一些div有一些内容。 点击链接后,我希望该内容被其他一些东西取代。 这与replace_html和rjs一起工作正常。

但是,我更喜欢旧内容和新内容之间的轻微淡入/淡出(交叉渐变?)过渡。 div也会稍微调整一下,如果这样做会产生增长/收缩效果,那就更酷了。 我认为Scriptaculous必须有这样的内置,但我确实无法找到它,如果他们这样做。

顺便提一下,如果你有一个Basecamp帐户就有一个很好的例子:登录并单击“所有人”然后“添加新公司”以查看效果。

有人知道怎么做吗? 谢谢! 布赖恩

要进行交叉淡入淡出,您需要绝对定位新内容,并使用与旧内容相同的x / y坐标。 这是一个经过测试的例子:

page.insert_html :after, 'old-content', content_tag('p', '[new content]', :id => 'new-content', :style => 'display:none') page << <<-JS var oldOffset = $('old-content').cumulativeOffset(); $('new-content').setStyle({ position: 'absolute', left: oldOffset.left + 'px', top: oldOffset.top + 'px' }); JS page['old-content'].fade :duration => 3 page['new-content'].appear :duration => 3 

注意中间的大块 – 在Prototype中比在RJS中更容易。

一个策略可能是将元素放在包装div中,淡出包装div,替换元素中的HTML,然后再次淡入包装div。

我自己不是一个RJS / scriptaculous用户,所以我不确定代码是什么,但我很确定该策略会起作用。

淡出第一个div。 同时在第二个div中盲目。 随着第一个消失,第二个将展开第一个剩下的。

好吧,就像那样。

如果你想查看他们正在调用的内容,请加载Firebug并逐步执行代码。

一种快速的方法是进行替换然后脉动div。