- 关 键 词:
- dreamweaver
- frontpage
制作简单的互动效果
在网页上经常看到这样的效果,当鼠标移到一张图片上的时候,原来的图片就切换为另一张图片,鼠标移开后,又恢复原来的模样,是怎么做的呢?在开篇的时候,提到Dreamweaver比Frontpage优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在,我们就利用Dreamweaver制作这个最简单的互动效果——变换图片。
准备两张大小相同的图片,一张是鼠标还没有移上的状态,另一张是鼠标移上去后的图片,例如以下两图,左图是一个凸起的按钮,右图是一个凹下的按钮:

点击对象面板上的
,看到如下的对话框:
① Image Name:变换图片效果的标记名称,Dreamweaver会自动分配;
② Original Image:指定原始的图片,(例如这里是凸起的图)
③ Rollover Image:指定鼠标移上去后的图片(例如这里是凹下的图);
④ Url:图片的链接网址;
例如按照上图的设置完毕后,按下OK,然后可以按F12预览一下效果了。
请保留地址 http://www.qqread.com/dreamweaver/h662119102.html
更多内容请看Solaris基础知识入门、ASP.NET教程、FreeBSD使用教程专题,或进入讨论组讨论。
在网页上经常看到这样的效果,当鼠标移到一张图片上的时候,原来的图片就切换为另一张图片,鼠标移开后,又恢复原来的模样,是怎么做的呢?在开篇的时候,提到Dreamweaver比Frontpage优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在,我们就利用Dreamweaver制作这个最简单的互动效果——变换图片。
准备两张大小相同的图片,一张是鼠标还没有移上的状态,另一张是鼠标移上去后的图片,例如以下两图,左图是一个凸起的按钮,右图是一个凹下的按钮:

点击对象面板上的
,看到如下的对话框:① Image Name:变换图片效果的标记名称,Dreamweaver会自动分配;
② Original Image:指定原始的图片,(例如这里是凸起的图)
③ Rollover Image:指定鼠标移上去后的图片(例如这里是凹下的图);
④ Url:图片的链接网址;
例如按照上图的设置完毕后,按下OK,然后可以按F12预览一下效果了。
请保留地址 http://www.qqread.com/dreamweaver/h662119102.html
相关图文阅读
频道图文推荐
健 康 咨 询
时 尚 咨 询
相关专题
- Solaris基础知识入门 (4642篇文章)
- ASP.NET教程 (8464篇文章)
- FreeBSD使用教程 (6587篇文章)
- 网页改版是家家难念的经 (0次浏览)
- DWMX+ACCESS制作企业新闻系统 (0次浏览)
- DW8代码工具栏试用 (0次浏览)
- DW MX 中表单数据的传递 (0次浏览)
- DW MX 设计360度全景滚动效果图 (0次浏览)
- DW MX 的快键一览表 (0次浏览)
- Dreamweaver MX中移动层的使用 (0次浏览)
- Dreamweaver MX制作文字特效 (0次浏览)
- Dreamweaver MX 也要 VSS (0次浏览)
- 制作网页的十大诀窍! (0次浏览)





