2013-06-12 100 views
1

我只花了一個小時就想到了一些優雅的效果來添加到高端客戶端網站 - 我認爲最簡單的方法就是添加一個簡單的淡入淡出效果。隱藏/淡入效果 - 跨瀏覽器?

唯一讓我擔心的是它需要高度跨瀏覽器/跨平板電腦的功能是否有任何論點,下面的腳本可能是有害的網站?

的。主要纏繞DIV包圍所有的主要網頁內容(不包括導航或背景),所以下面的腳本應該只是加載的所有內容,一旦頁面加載 -

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

我想,如果客戶端瀏覽器的JavaScript支持很差 - 那麼.main-wrap不會隱藏在第一位,我不能想到任何其他消極的 - 但如果任何人可以請讓我知道!

回答

3

我必須說,你可以連它有更好的表現(無需調用兩次相同的選擇):

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

it needs to be highly cross-browser/cross tablet functional我們知道這些天的移動設備擁有更好的瀏覽器具有更好html5/css3兼容性和功能齊全。所以一定不會有任何問題。然而,這需要一個深思熟慮的工作。正如我上面提到的更好將緩存選擇器在代碼中的多個區域使用。

2

如果您最初在類定義css中添加display:none,那麼不需要調用$('。main-wrap')。hide();和您的代碼將按預期工作

.main-wrap 
{ 
    display: none; 
}