我有一个显示插图的Ruby on Rails项目。顶部有类别链接，这些链接可以淡出插图，将其替换为新内容，然后再淡入。
我正在使用jQuery 1.6.2。
它可以在Safari 5，Firefox 6，Chrome 14和IE9中正常运行。在IE7 + 8中，将html替换为新内容，但不会出现褪色。
首先，我使用的是html5元素，以为可能是这样，但是此后我将它们全部替换为div，问题仍然存在。我尝试添加/删除Modernizr和Selectivizr库无效。感谢您的帮助，代码如下：
app / views / illustrations / index.html.erb
<div id="illustrations" class="illustration-list">
<%= render @illustrations %>
</div>
app / views / illustrations / _illustration.html.erb
<div class="illustration">
<div class="figure">
<%= link_to image_tag(illustration.image.url(:thumb), alt: illustration.title), illustration %>
<div class="figcaption">
<%= link_to illustration.title, illustration %>
</div>
</div>
</div>
app / views / shared / _category_links.html.erb-触发ajax
<ul>
<% category_links.each do |category| -%>
<li class="<%= category.name.downcase %>">
<%= link_to category.name, category, remote: true %>
</li>
<% end -%>
</ul>
最后是/app/views/categories/show.js.erb
var data = "<%= escape_javascript(render(@illustrations)) %>";
var div = $('#illustrations');
div.fadeOut("slow", function() {
div.html(data);
div.fadeIn('slow');
});
编辑这是一个没有图像的示例，但是您应该可以理解http://jsbin.com/ifisuh/4/edit#preview。
最佳答案
IE7 / 8的不透明度支持非常脆弱。如第一条评论中所述，它需要ActiveX，因此调用的第一个端口是确保：
您的Windows计算机支持它（它不喜欢VM或低色台式机）。
您已经安装了适当的DLL。
您的IE副本已配置为允许ActiveX在适当的区域中。
显然，这需要为任何IE7 / 8客户端正确设置。在Intranet上，这可能意味着您必须手动检查每个用户的计算机。另一方面，如果您的站点将在整个Internet上使用，那么您将永远无法保证任何给定的IE用户都能看到您的不透明效果。 （虽然公平地说，大多数IE用户都应该可以）
但是，即使您可以使用它，IE的不透明也存在许多已知的错误，尤其是在处理图像时。可以通过调整图形来解决其中一些错误-使用其他图像格式；避免图像中出现任何纯黑色或白色；不要尝试淡化具有alpha透明度的图像；等等-但有些错误是无法避免的。您还应该避免尝试同时淡化grpahic和文本元素，因为这会使错误更明显（因为文本比图形更平滑地淡出）。 [目前无法找到我要参考的网站，这更详细地解释了其中的一些内容；当（如果找到）将编辑此答案]
最重要的是，IE7 / 8中的淡入淡出非常容易。如果它适合您，那就太好了；但通常情况下，它根本无法以您想要的方式完成。对于某些站点，这意味着最好的解决方案就是根本不尝试使用IE7 / 8进行褪色。
很抱歉，我在这里没有给您带来好消息。希望我提供的一些提示会有所帮助，但请做好准备，以防万一。