Dreamweaver CC教程:创建鼠标经过图像

Dreamweaver CC教程:创建鼠标经过图像

创建鼠标经过图像
鼠标经过图像是一种当您浏览器中进行查看并将鼠标指针扫过它时,会发生变化的图像。要创建鼠标经过图像,您必须具有两个图像。主图像或首次加载页面时显示的图像,以及次图像或鼠标指针扫过主图像时显示的图像。这两个鼠标经过图像的大小必须相同。如果图像大小不同,Dreamweaver 会调整第二个图像,使其与第一个图像的属性匹配。
系统会自动将鼠标经过图像设置为对 onMouseOver 事件做出响应。您可以将图像设置为对不同的事件做出响应。例如,鼠标单击或更改鼠标经过图像。
1、在“文档”窗口中,将插入点放置在要显示鼠标经过图像的位置。
2、使用以下方法之一插入鼠标经过图像:

在“插入”面板中,从下拉列表中选择“HTML”。从选项列表中选择“鼠标经过图像”。 选择“插入”>“HTML”>“鼠标经过图像”。

3、在“插入鼠标经过图像”对话框中,选择图像,然后设置鼠标经过图像的属性。您可以设置下列属性:
设置鼠标经过图像的属性
设置鼠标经过图像的属性

图像名称
鼠标经过图像的名称。
原始图像
页面加载时要显示的图像。在文本框中输入路径,或单击“浏览”并选择该图像。
鼠标经过图像
鼠标指针滑过原始图像时要显示的图像。输入路径或单击“浏览”选择该图像。
预载鼠标经过图像
将图像预先加载浏览器的缓存中,以便用户将鼠标指针滑过图像时不会发生延迟。
替换文本
这是一种(可选)文本,为使用只显示文本的浏览器的访问者描述图像。
按下时,前往的 URL
用户单击鼠标经过图像时要打开的文件。输入路径或单击“浏览”并选择该文件。
注意:
如果您没有为图像设置链接,Dreamweaver 将在 HTML 源代码中插入一个空链接 (#),并将鼠标经过图像行为附加于该链接。如果您删除这一空链接,鼠标经过图像将不起作用。
4、如需预览鼠标经过图像,请选择“文件”>“实时预览”,或按 F12。
5、在浏览器中,将鼠标指针移过原始图像以查看鼠标经过图像。
注意:
不能在“设计”视图中看到鼠标经过图像的效果。

 

推荐阅读