网页多幅图片显示妙法－Dreamweaver技巧

　　有些主页包含大量展示性的图片，并且要显示在特定位置上。在设计主页时，假如将每张图片放在新开窗口中，浏览者就经常需要关闭新打开的窗口，这样很不方便；也能够将任何图片都放在同一窗口中的不同层中隐藏起来，需要谁就显示谁，但这种做法又会使打开该网页的时间猛增（即使是隐藏的图片也要打开时一并读入）。笔者曾设计一个有20幅图片的网页，采用此法，在28.8KB/s的连接速率下，显示打开时间竟然有208秒。后来，笔者无意中发现，配置分层文本能够解决这个问题。利用“行为”面板，能够动态配置某层中的文本或替换层中的内容，新配置的内容能够是任意类型的HTML，因此，利用该“动作”可动态地显示各种信息，当然包括图片。最为关键的是，利用这一技巧，能够做到需要显示哪幅图片，就可将其调出装入特定的层中，即用即读，避免一次装入，占用大量时间。笔者上面提到的208秒网页，经过这样处理后，打开只需18秒。具体做法如下：
　　1.新建层,命名为：ImgeLayer，此层将作为图片的展示窗口；

　　2.将要显示的图片分别制作缩略图，并摆放在页面上，以便点击此略图，并相应在ImgeLayer中显示源图。假设略图为：SImge1、SImge2、SImge3……，分别对应源图：Imge1、Imge2、Imge3……

　　3.选中SImge1，打开“行为”面板，确保Events For下拉按钮显示为IE 4.0（或IE 5.0），点击“ ”按钮，在弹出的“动作”选单中，选“配置文字”项下的“配置图层文字”，打开配置图层文字对话框，在图层下拉列表中选ImgeLayer，在新的HTML输入框中输入：〈img src="imge1.jpg" width="300" height="200"〉(读者可根据实际情况，调整文档路径及图像尺寸)。

　　4.其他图片的配置方法同上。

　　需要注意的是，上面提到的设计方法需要IE 4.0以上浏览器支持。

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有