Dreamweaver 4 简明教程(八、为网页增添互动效果)
发布时间：
2006-10-14 3:07:16
收集提供：
gaoqian
八、为网页增添互动效果
制作简单的互动效果
在网页上经常看到这样的效果，当鼠标移到一张图片上的时候，原来的图片就切换为另一张图片，鼠标移开后，又恢复原来的模样，是怎么做的呢？在开篇的时候，提到
Dreamweaver
比
FrontPage
优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在，我们就利用Dreamweaver制作这个最简单的互动效果——变换图片。
准备两张大小相同的图片，一张是鼠标还没有移上的状态，另一张是鼠标移上去后的图片，例如以下两图，左图是一个凸起的按钮，右图是一个凹下的按钮：
点击对象面板上的
，看到如下的对话框：
①
Image Name：变换图片效果的标记名称，Dreamweaver会自动分配；
②
Original Image：指定原始的图片，（例如这里是凸起的图）
③
Rollover Image：指定鼠标移上去后的图片（例如这里是凹下的图）；
④
Url：图片的链接网址；
例如按照上图的设置完毕后，按下OK，然后可以按F12预览一下效果了。
|
网站空间
|
网络空间
|
域名注册
|
网站推广
|
虚拟主机
|
网通空间
|
电信空间
|
ftp空间
|
wap空间
|
|
asp空间
|
aspx空间
|
.net空间
|
php空间
|
数据库空间
|
html5空间
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
，看到如下的对话框：