如何使JavaScript加载速度更快？

Question

现在，我们有使用javascript的图像幻灯片。但是，当页面仍在加载时，在javascript被读取并执行之前，图像将以正常列出的样式（带有项目符号）简要显示。问题是，我们不希望访问者看到“裸体”图像列表，即使只是简单地（有时会持续2-3秒）。我们希望他们立即只看到一个图像（不是一个列表），变成另一个（js做什么）。

这是幻灯片的HTML代码：

<div class="slideshow"> 
    <ul> 
     <li><img src="images/....jpg" /></li> 
     <li><img src="images/....jpg" /></li> 
     <li><img src="images/....jpg" /></li>         
     <li><img src="images/....jpg" /></li> 
     <li><img src="images/....jpg" /></li> 
    </ul> 
</div> 

这是我们所使用的幻灯片：

http://www.littlewebthings.com/projects/blinds/

，这是JS文件：

http://www.littlewebthings.com/projects/blinds/js/jquery.blinds-0.9.js

我正在考虑临屋区这可能是一个缓存问题，因为上面的演示幻灯片只显示一次“裸”图像列表。一旦它被刷新/重新访问，它不再显示（或者仍然显示比第一次快得多，几乎无法察觉）。另一方面，我们不断重新阅读JavaScript，就好像它总是第一次（如果你知道我的意思）。

Answer 1

虽然这并不直接回答让它立即加载的问题，但一种选择是从<div class="slideshow" id="myId" style="visibility: hidden">隐藏你的div开始，然后一旦你知道JS已经加载，显示它（例如使用jQuery的）：

$("#myId").css("visibility", "visible"); 

Answer 2

用css隐藏所有列表，只显示第一个图像。所以用户不会看到除第一张图像外的所有列表。

Answer 3

尝试编辑UL风格是这样的：

ul{ 
    list-style:none; 
} 

ul li{ 
    position:absolute; 
} 

名单包装必须有一个固定的高度;）

希望它可以帮助