javascript-您可以在Rails RJS中将replace_html与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中容易.
标签:scriptaculous,ajax,javascript,ruby-on-rails 来源: https://codeday.me/bug/20191107/2004233.html