Question

我只有一个小时的时间来考虑添加到高端客户端网站的一些优雅外观效果 - 我认为最简单的方法就是添加一个简单的淡入效果。

只有让我担心的是它需要高度跨浏览器/跨平板电脑功能是否有任何争论，以下脚本可能对网站有害？

.main-wrap div包围所有主要页面内容（不包括导航或背景），因此以下脚本应该只在页面加载后加载所有内容 -

$(document).ready(function () {
    $('.main-wrap').hide();
    $('.main-wrap').fadeIn(4000);    
});

我认为如果客户端浏览器的javascript支持不佳 - 那么.main-wrap在第一时间就不会隐藏，我不能想到任何其他的负面消息 - 但是如果有其他人可以请告诉我！

Answer 1

我必须说你可以链接它以获得更好的性能（无需再调用两次相同的选择器）：

$(document).ready(function () {
   $('.main-wrap').hide().fadeIn(4000);    
});

it needs to be highly cross-browser/cross tablet functional 我们现在知道移动设备有更好的浏览器，它们具有更好的html5 / css3兼容性和功能齐全。所以一定不能有任何问题。然而，这需要一个经过深思熟虑的工作。正如我上面提到的，更好的方法是缓存选择器，以便在代码中的多个区域中使用。

Answer 2

如果您最初在类定义css中添加display:none，则无需调用 $（'。main-wrap'）。hide（）; ，您的代码将起作用正如预期的那样

.main-wrap
{
    display: none;
}

隐藏/淡入效果 - 跨浏览器？

2 个答案: