Dreamweaver 4 简明教程(八、为网页增添互动效果)
<STRONG>八、为网页增添互动效果<BR><BR></STRONG> <B>制作简单的互动效果</B><BR><BR><BR> 在网页上经常看到这样的效果，当鼠标移到一张图片上的时候，原来的图片就切换为另一张图片，鼠标移开后，又恢复原来的模样，是怎么做的呢？在开篇的时候，提到Dreamweaver比Frontpage优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在，我们就利用Dreamweaver制作这个最简单的互动效果——变换图片。<BR><BR><BR> 准备两张大小相同的图片，一张是鼠标还没有移上的状态，另一张是鼠标移上去后的图片，例如以下两图，左图是一个凸起的按钮，右图是一个凹下的按钮：<BR><BR><P align=center><IMG src="/bbs/attachments/websoft/20081206/200812713344743777801.jpg"> <IMG src="/bbs/attachments/websoft/20081206/200812713344748477802.jpg"></P><BR><BR> 点击对象面板上的 <IMG src="/bbs/attachments/websoft/20081206/200812713344753177803.gif"> ，看到如下的对话框：<BR><BR><P align=center><IMG src="/bbs/attachments/websoft/20081206/200812713344757877804.gif" align=center></P><BR><BR> <FONT color=red>①</FONT> Image Name：变换图片效果的标记名称，Dreamweaver会自动分配；<BR><BR> <FONT color=red>②</FONT> Original Image：指定原始的图片，（例如这里是凸起的图）<BR><BR> <FONT color=red>③</FONT> Rollover Image：指定鼠标移上去后的图片（例如这里是凹下的图）；<BR><BR> <FONT color=red>④</FONT> Url：图片的链接网址；<BR><BR><BR> 例如按照上图的设置完毕后，按下OK，然后可以按F12预览一下效果了。 <BR>
页:
[1]