预装载以及JavaScript Image()对象

列表A中的HTML代码建立了一个包括四个按钮的菜单条，每一个按钮都有三种状态：正常、鼠标悬浮和单击。触发条件如下：

dedecms.com

鼠标指针移动到处于正常状态的按钮，按钮则变为鼠标悬浮状态。鼠标移出按钮区域之后，按钮返回到正常状态。

copyright dedecms

鼠标单击按钮，按钮则变为单击状态。在另一按钮被单击之前，它将保持在此状态。

本文来自织梦

如果单击了某个按钮，其他任何按钮不能处于单击状态，只能是处于鼠标悬浮或正常状态。 织梦好，好织梦

每次只能单击一个按钮。 本文来自织梦

每次只能有一个按钮处于鼠标悬浮状态。

首要任务是设置存储菜单每种状态图片的数组。数组元素相应的元素<img>同样在HTML文档主体中创建，并且按照顺序命名。请注意，数组值的索引序列是从0开始，而相应的<img>元素则从1开始命名——这就要求在脚本的后半段要对相应数值作运算调整。 dedecms.com

函数preloadImages()负责将所有图片装载到缓存中，因此留给鼠标的响应时间就会很少。循环for()被用来在第一阶段重复完成图片创建操作，并随后对每个图片进行预装载。 织梦内容管理系统

函数resetAll()是将所有图片重置为正常状态的非常方便的方法。这是必需的，因为当菜单上某个按钮被单击的时候，菜单上面其他所有按钮在被单击按钮改变状态前必须恢复到正常状态。 本文来自织梦

函数setNormal()、setHover()以及setClick()负责将特定图像（图像编号将作为函数参数传递）的图片源改变为相应正常、鼠标悬浮或单击状态的图片源。由于被单击的图像在另一图像被单击之前必须保持状态（参考规则#2），因此被单击图片将暂不接受鼠标动作。函数setNormal()以及setHover()代码仅完成图片不在单击状态的情况下改变图片状态的动作。 织梦内容管理系统

以上只是通过使用预装载技术加速JavaScript效果响应多种办法中的一种。在站点中可以使用以上技术，并且根据实际情况进行调整。祝一切顺利！ dedecms.com

看完这篇，您有何感觉呢？