网页设计与制作项目全套ppt教程完整版课件(最新).ppt

制作演示 使用“Floating image”插件 。 制作演示 “Floating image”插件对话框 漂浮图片的位置 超级链接地址 相关知识 插件又称扩展，是可以添加到Dreamweaver应用程序中，以增强网页功能的文件。运用插件，可以很方便的把网页制作得更加精美，而且还可以制作出很多动态的效果。 可以自己使用HTML、Javascript或C等编程语言来编写一个新插件，也可以从网上下载已开发好的插件。 Dreamweaver的插件管理器就是管理插件的工具，可以完成对插件的安装、删除、打包上传等工作。 　　 1．插件的知识 相关知识 　　 2．插件的种类 Dreamweaver中的插件分为多种，如果按作用划分，可分为链接类插件、导航类插件、窗口类插件、层类插件等。如果按性质划分，可分为HTML代码插件、JavaScript命令插件，以及新的行为、属性检查器和浮动面板等。安装插件后，根据性质的不同，插件命令被分别放在不同的菜单和面板中。插件中，比较常见的有行为类、命令类、对象类插件。 相关知识 　　 3．常用插件 定义鼠标右键菜单的 RightClickMenuBuilder插件对话框Menu选项 相关知识 编辑模板 相关知识 　最后，选中要插入可编辑区域的单元格，单击“常用”快捷栏的“模板”按钮，在弹出的菜单中选择“可编辑区域”命令，如图所示。 相关知识 　 弹出“新建可编辑区域”对话框，在“名称”文本框中输入“content”，单击“确定”按钮即可，如图所示。 相关知识 　（2）利用已制作好的模板文档新建网页文档 选择“文件”→“新建”菜单，弹出“新建文档”对话框，如图所示，单击“创建”按钮就可以了。 相关知识 “新建文档”对话框 相关知识 　（3）修改模板文档 打开“资源”面板，单击“模板”按钮，选中“index”模板，双击就可以修改模板页面了，如图所示。修改保存后，会弹出一个“更新模板文件”对话框，如图所示，单击“更新”按钮即自动将所有由此模板创建的网页自动更新为新模板的样式。 以后还可根据需要，选择 “修改”→“模板”菜单下的“更新当前页”或者“更新页面”选项来手动更新某网页。 相关知识 编辑模板 模板按钮 “更新模板文件”对话框 项目渐近 网站项目“我心飞扬”之第六阶段美化并高效制作各页面 制作演示 ◎ 操作要点 （1）创建库项目； （2）创建模板文件； （3）使用模板套用之前创建的各网页文件。 拓展训练 “流行文学作品荟萃” 拓展训练 “流行文学作品荟萃” 嵌套表格 大连理工大学出版社 THANKS! 任务引领 ◎ “动物世界：网络相册” 　　网页打开后，将显示“动物世界：网络相册”界面，用户鼠标移到小图上面的时候，在固定区域显示对应大图 ，也可以按照最下行菜单提示进行相应的操作 制作演示 相关知识 1．Dreamweaver行为的概念和作用 　 行为是Dreamweaver提供的强有力的工具，利用它可以自动生成JavaScript程序来实现一些特定的人机交互效果，使得不懂编写JavaScript程序的人也能建立简单常用的交互页面，提升用户体验。 行为是某个事件和由该事件触发的动作的组合，即事件=行为+动作。在“行为”面板中，可以先指定一个动作，然后指定触发该动作的事件，以此将行为添加到页面中。 相关知识 　　 2．认识事件 事件是浏览器生成的消息，它指示该页的访问者已执行了某种操作。例如，当访问者将鼠标指针移到某个链接上时，浏览器将为该链接生成一个 onMouseOver 事件；然后浏览器检查是否应该调用某段 JavaScript 代码（在当前查看的页面中指定）进行响应。不同的页元素定义了不同的事件；例如，在大多数浏览器中，onMouseOver 和 onClick 是与链接关联的事件，而 onLoad 是与图像和文档的 body 部分关联的事件。 相关知识 　　 3．认识动作 动作是一段预先编写的 JavaScript 代码，可用于执行诸如以下的任务：打开浏览器窗口、显示或隐藏 AP 元素、播放声音或停止播放影片。Dreamweaver 所提供的动作提供了最大程度的跨浏览器兼容性。 在将行为附加到某个页面元素之后，每当该元素的某个事件发生时，触发行为，即会调用与这一事件关联的动作 （JavaScript 代码）。 相关知识 4．行为的应用顺序 网页中可以同时为一个对象添加多个事件来触发不同的行为，所有的行为按照字母顺序排列。但是，不能用相同的事件来触发不同的动作。 学生练习 任务引领 ◎ “百变页面” 　　启动浏览器预览案，网页显示“百变页面”的图文信息。