07动态效果显示层教学课件 高教版 中职 网页设计与制作(Dreamweaver CS5) .ppt
《07动态效果显示层教学课件 高教版 中职 网页设计与制作(Dreamweaver CS5) .ppt》由会员分享,可在线阅读,更多相关《07动态效果显示层教学课件 高教版 中职 网页设计与制作(Dreamweaver CS5) .ppt(6页珍藏版)》请在淘文阁 - 分享文档赚钱的网站上搜索。
1、07动态效果显示层教学课件 高教版 中职 网页设计与制作(Dreamweaver CS5)动态效果显示层静态网站制作教学资源课件静态网站制作教学资源课件当鼠标在网页的某个图片或文字对象上滑动时,使用Dreamwever的行为可以实现该段文字或图像动态效果显示,比如增大、缩小等。实例实例8:如图所示,当鼠标移到左侧第一个图片时,该图片宽度和高度都压缩至50%,当鼠标移开时再动态恢复成原状,所需素材在资料包中提供。1、在练习站点里,先新建如上图所示的网页,即先在网页中插入2行1列900像素宽的表格,再在第二行的单元格中插入2行5列宽度100%的布局表格。2、将插入点光标移到第二个布局表格第二行左侧
2、第一单元格中,单击“插入”菜单“布局对象”中的“Div标签”命令。3、打开“插入Div标签”对话框,在“插入:”列表框中选择“在插入点”,在“ID”列表框中输入“tu1”,单击“确定”按钮,并删掉网页中反相显示的“此处显示 id tu1 的内容”,在新插入的图层“tu1”中插入“images/1.jpg”。4、在任务栏中选中“div#tu1”,打开“行为”面板,单击添加动作钮从如图所示的“动作”菜单中选择“效果”中的“增大/收缩”,打开“增大/收缩”对话框,并按如图5.26所示进行设置。5、单击“确定”按钮,给图层“tu1”添加了一个“收缩”动作,在“行为”面板上将“收缩”效果动作的响应事件修改为“onmouseover”。6、继续给图层“tu1”添加“增大”动作,并将“增大”效果动作的响应事件修改为“onmouseout”增大效果设置如图5.27所示。因为是将已经缩小以为50%的图片增大为100%,所以这里“增大自:”100%,“增大到:”200%
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 07动态效果显示层教学课件 高教版 中职 网页设计与制作Dreamweaver CS5 07 动态 效果 显示 教学 课件 高教 网页 设计 制作 Dreamweaver CS5
链接地址:https://www.taowenge.com/p-87381753.html
限制150内