动网论坛,站长建站首选,国内使用量最多的论坛软件 动网论坛官方技术讨论区 站长工具 申请属于您自己的免费论坛
首页 | 新闻资讯 | 网站运营 | 网络编程 | 数据库 | 服务器 | 网页设计 | 图像媒体 | 网络应用 | 搜索优化 | 资源下载 | 动网主机 | DVBOX
    本站内  互联网 ASP论坛  ASP.Net论坛  PHP论坛
   DreamWeaver → 阅读文章

 Dreamweaver 4 简明教程(八、为网页增添互动效果)

作者来源: 
阅读 2121 人次 , 2006-4-19 16:01:00 

八、为网页增添互动效果

  制作简单的互动效果


  在网页上经常看到这样的效果,当鼠标移到一张图片上的时候,原来的图片就切换为另一张图片,鼠标移开后,又恢复原来的模样,是怎么做的呢?在开篇的时候,提到Dreamweaver比Frontpage优胜的其中一个地方是Dreamweaver能做出能具互动性的网页。现在,我们就利用Dreamweaver制作这个最简单的互动效果——变换图片。


  准备两张大小相同的图片,一张是鼠标还没有移上的状态,另一张是鼠标移上去后的图片,例如以下两图,左图是一个凸起的按钮,右图是一个凹下的按钮:

Dreamweaver 4 简明教程(八、为网页增添互动效果) Dreamweaver 4 简明教程(八、为网页增添互动效果)



  点击对象面板上的 Dreamweaver 4 简明教程(八、为网页增添互动效果) ,看到如下的对话框:

Dreamweaver 4 简明教程(八、为网页增添互动效果)



   Image Name:变换图片效果的标记名称,Dreamweaver会自动分配;

   Original Image:指定原始的图片,(例如这里是凸起的图)

   Rollover Image:指定鼠标移上去后的图片(例如这里是凹下的图);

   Url:图片的链接网址;


  例如按照上图的设置完毕后,按下OK,然后可以按F12预览一下效果了。
  
 本文Tagsdreamweaver  
 收藏本文  打印本文  论坛讨论  关闭窗口
· 上一篇:Dreamweaver 4 简明教程(七、网页的排版4)
· 下一篇:Dreamweaver 4 简明教程(八、为网页增添互动效果2)
· DW MX 2004 CSS属性详解之FLIPH属性
· 用Dreamweaver制作动态链接的Flash按钮
· 如何防止及消除垃圾代码的产生
· 巧使网页图片产生旋转效果
· Dreamweaver 4 简明教程(四、从最简单的网页开始)


关于本站 | 联系我们 | 业务合作 | 客户案例 | 诚聘英才 | 广告合作 | 收藏本站
海口动网先锋网络科技有限公司版权所有
Copyright © 2000 - 2006 Cndw.Com
中华人民共和国电信与信息服务业务经营许可证编号 琼 ICP 020077