Dreamweaver FrontPage HTML/CSS Javascript 
Google adsense申请技巧本站核心代理域名注册主机业务 快速发布你的买卖域名买卖网站信息 1元注册 cn域名
站长每日新闻导读 √ ·推荐万网空间¥120元 150m 站长网:站长必上的网站网站联盟大全本站代理万网域名55空间120元
 2006-12-10 19:42:11

教程/dreamweaver/入门 Dreamweaver 4 简明教程14(互动效果)

来源: 字体:[ ]
制作简单的互动效果


  在网页上经常看到这样的效果,当鼠标移到一张图片上的时候,原来的图片就切换为另一张图片,鼠标移开后,又恢复原来的模样,是怎么做的呢?在开篇的时候,提到Dreamweaver比Frontpage优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在,我们就利用Dreamweaver制作这个最简单的互动效果——变换图片。


  准备两张大小相同的图片,一张是鼠标还没有移上的状态,另一张是鼠标移上去后的图片,例如以下两图,左图是一个凸起的按钮,右图是一个凹下的按钮:


 



  点击对象面板上的  ,看到如下的对话框:



   Image Name:变换图片效果的标记名称,Dreamweaver会自动分配;

   Original Image:指定原始的图片,(例如这里是凸起的图)

   Rollover Image:指定鼠标移上去后的图片(例如这里是凹下的图);

   Url:图片的链接网址;


  例如按照上图的设置完毕后,按下OK,然后可以按F12预览一下效果了。
网站地图 - 域名注册续费虚拟主机代理 - 交易论坛 - 网站投稿 - 广告服务 - 帮助中心 - 联系我们
Copyright ©2003-2007 www.Admin5.com All Rights Reserved