繁體中文当前位置: 首页 > 图文教程 > 网页制作 > Dreamweaver > Dreamweaver 4 简明教程(八、为网页增添互动效果)
- Dreamweaver
- Ultradev实例教程:2.2 用ODBC连接数据库
- Ultradev实例教程:2.3 创建Web站点
- Ultradev实例教程:2.4 UltraDev与各种数据库的连接代码
- Ultradev实例教程:3.1 定义站点
- Dreamweaver3 图层应用技巧（六）
- DreamWeaver高级应用—模板与库
- Dreamweaver4.0 快捷键自己DIY
- Dreamweaver经典技巧，一个也不能少
- Dreamweaver的操作诀窍点滴
- Dreamweaver 4.0 新增功能全接触
- 在IE中调用Dreamweaver编辑网页
- 利用Dreamweaver插件改变IE浏览器滚动条
- 使网页随浏览器伸展
- 水平细线的几种制作方法
- Dreamweaver行为全接触(1)
- Dreamweaver行为全接触(2)
- Dreamweaver行为全接触(3)
- Dreamweaver行为全接触(4)
- Dreamweaver行为全接触(5)
- DreamWeaver表格妙用-线框制作详解(1)
Dreamweaver 4 简明教程(八、为网页增添互动效果)
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-11-23 浏览: 27 ::
收藏到网摘: n/a
制作简单的互动效果
在网页上经常看到这样的效果，当鼠标移到一张图片上的时候，原来的图片就切换为另一张图片，鼠标移开后，又恢复原来的模样，是怎么做的呢？在开篇的时候，提到Dreamweaver比Frontpage优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在，我们就利用Dreamweaver制作这个最简单的互动效果——变换图片。
准备两张大小相同的图片，一张是鼠标还没有移上的状态，另一张是鼠标移上去后的图片，例如以下两图，左图是一个凸起的按钮，右图是一个凹下的按钮：
点击对象面板上的
，看到如下的对话框：
① Image Name：变换图片效果的标记名称，Dreamweaver会自动分配；
② Original Image：指定原始的图片，（例如这里是凸起的图）
③ Rollover Image：指定鼠标移上去后的图片（例如这里是凹下的图）；
④ Url：图片的链接网址；
例如按照上图的设置完毕后，按下OK，然后可以按F12预览一下效果了。
评论 (0) All
