当前位置: 首页 > 图文教程 > 网页制作 > Dreamweaver > DW MX实例:图片应用技巧

Dreamweaver
Dreamweaver打造多彩文字链接
Dreamweaver基础技巧全面接触
Dreamweaver MX 2004从零开始(4)
Dreamweaver MX 2004设计留言本实战
Dreamweaver MX 2004从零开始(5)
Dreamweaver MX 2004从零开始(6)
Dreamweaver MX 2004从零开始(7)
Dreamweaver MX 2004 打造细线表格
在DW中插入Flash的参数详解
用Dreamweaver MX建设神奇网页图片超链接
Dreamweaver中实现flash的透明背景
DreamweaverMX打造留言本(二)
DreamweaverMX打造留言本(三)
DreamweaverMX打造留言本(四)
DreamweaverMX打造留言本(五)
Dreamweaver MX技巧汇粹
DreamwaverMX与ASP.NET(一)
DreamwaverMX与ASP.NET(二)
DreamwaverMX与ASP.NET(三)
DreamwaverMX与ASP.NET(四)

Dreamweaver 中的 DW MX实例:图片应用技巧


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-23   浏览: 83 ::
收藏到网摘: n/a

  加快图片下载速度

  如果网页中有过多的图片,就会影响浏览的速度。 Dreamweaver 可以轻松设置预载图片,加快图片下载速度,让站点以最快的速度出现在用户面前。

  效果说明 建立文件,先预载图片,使图片预先下载到缓存中,加快图片下载速度。实际效果请浏览随书光盘中《 Dreamweaver MX 2004 100 例》目录下的《实例 36 -加快图片下载速度》文件。

  创作思想 打开 Dreamweaver MX 2004 软件新建页面,再打开标签面板,在【行为】中选择【预先载入图像】选项,加快图片下载速度。

  操作步骤

  ( 1 )新建文件,操作如图 36-1 所示。

  
Dreamweaver


  ( 2 )保存页面并插入图片。为了在插入图片时不提示相对路径,先保存页面为“ 36.htm ”。然后插入要预载的图片,如图 36-2 所示。

  
Dreamweaver
图 36-2  插入图片


  ( 3 )添加“预先载入图像”功能。使用 Dreamweaver 的行为面板添加“预先载入图像”功能,如图 36-3 所示。

  ( 4 )选择要预载的图片,操作如图 36-4 所示。

  
Dreamweaver



  提示:如果站点上有几张大图片,可以单击【预先载入图像】上方的【 + 】图标,添加多张预载图像,具体操作与图 36-4 所示相同。

  ( 5 )保存文件完成操作。这样就可以加快图片的下载速度,让用户在浏览网页时不会等太久,这对于提高网站的效能具有非常重要的意义。

  随机广告图片

  浏览者浏览网页时可以发现,网页中动态更新的广告图片比静态固定的图像更具有活力和吸引力。如何制作网页中的随机广告图片是本实例所要研究的问题。   

  效果说明 在浏览网页时,网页的 banner 区域将出现一张广告图片,如图 38-1 所示。随后每两秒更新一次广告图片,而且广告图片是以随机的方式出现的,如图 38-2 所示。

  

Dreamweaver



  创作思想 通过使用 Macromedia 的扩展插件 Advance_Random_Images ,可以轻松地完成网页中随机广告图片的制作。

  操作步骤

  ( 1 )安装插件。使用菜单栏中的【命令】|【扩展管理】命令调出【 Macromedia 扩展管理器】对话框,安装 Advance_Random_Images 扩展,如图 38-3 所示。

  

Dreamweaver



  ( 2 )调用命令。打开本实例源文件夹中的 banner.htm 文件,将光标置于要插入广告的位置上,并调出【 AdvancedRandomImages 】命令,如图 38-4 所示。

  

Dreamweaver



  ( 3 ) 设置图像。 在弹出的【 RandomImages 】对话框中对图片变换属性进行设定,如图 38-5 所示。

  

Dreamweaver



  ( 4 )添加图片。添加第一张广告图片,如图 38-6 所示。

  

Dreamweaver



  提示:本实例所用到的图片放于本实例素材文件夹中的 banner 文件夹中。

  ( 5 )接着用同样的方法添加其他图片,添加完成后单击【 OK 】按钮确定操作,如图 38-7 所示。

  

Dreamweaver



  ( 6 )然后保存页面文件并进行预览,随机广告图片的效果就制作出来了。读者可参考本实例素材文件夹中的 bannerok.htm 效果文件,看制作的结果是否正确。至此本实例制作完成。

  本实例所讲的技术常用于各类的网站中,如国内几个较大的门户网站上,几乎在他们的每个页面中都可看到这些变换广告,读者可参考这些内容来多加练习。