jquery - 页面加载和优先级

Question

我有一个包含很多画廊的页面（使用 Galleria 和 fancybox ）和顶部的图像滑块（nivo 滑块）。问题是滑块加载需要时间，导致浏览器同时加载画廊。现在我想给滑块一个优先级，所以页面至少会构建它的结构，或者也许让画廊只在点击时加载。

<script type="text/javascript"><!--fancybox-->
    $(document).ready(function() {
        $(".fancybox").fancybox();
    });
</script>

<script type='text/javascript'>
            Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
            Galleria.run('#gallery-1,#gallery-2,#gallery-3,#gallery-4,#gallery-5,#gallery-6,#gallery-7,#gallery-8,#gallery-9,#gallery-10,#gallery-11,#gallery-12,#gallery-1b,#gallery-2b,#gallery-3b,#gallery-4b');
 </script>

Answer 1

document.ready()您可以尝试使用window.onload ，而不是在加载 HTML 时加载的 using ，它在加载页面上的所有元素之后发生。

$(window).on("load", function(){
   $(".fancybox").fancybox();
});

然后，如果你想在点击事件上加载画廊：

$('relevantIDHere').on('click', function(){
  Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
  Galleria.run('#gallery-1,#gallery-2,#gallery-3,#gallery-4,#gallery-5,#gallery-6,#gallery-7,#gallery-8,#gallery-9,#gallery-10,#gallery-11,#gallery-12,#gallery-1b,#gallery-2b,#gallery-3b,#gallery-4b'); 
});