[jQuery] jQuery外掛套件在網頁載入一半時，呈現不完全的終極解決方式

2011-03-24

6492
0
jQuery

繼上次jQuery Cycle Plugin事件後，這次換jQuery Superfish Menu Plugin讓我被婊Orz

001

難道每用到一個Plugin就要找該Plugin的對應方法嗎？

那不就累死人

後來乾脆這樣做

在網頁的head區(此css一定要寫在head區或

用<link rel="Stylesheet" type="text/css" href="" />的方式在head區內include進來讓瀏覽器”優先”讀取)


          <style type="text/css">
            body
            {
               display:none;/*全部先隱藏*/
            }
            </style>

然後


<script type="text/javascript">

$(document).ready(function(){


   $("body").show(); //等網頁全部的DOM都載入後再顯示body

});
</script>

效果就變成，網頁剛載入時，畫面全白，等該載入的都全載入完畢後畫面就呈現出來了

另外，也可以比照此邏輯

如果只想讓部份html區塊(有可能那區塊就是使用jQuery Plugin的地方)在網頁載入時先隱藏

等瀏覽器全部讀完後再顯示該區塊的話


<style type="text/css">
 .myClassName
 {
   display:none;
 }

</style>

<script type="text/javascript">

$(document).ready(function(){


   $(".myClassName").show(); //等網頁全部的DOM都載入後再顯示.myClassName內容

});
</script>

回首頁