十.行为.

Slides:



Advertisements
Similar presentations
1 HTML 语言与网页设计 —— DHTML 技术 2 学习目标 理解客户端脚本的作用,掌握在 网页中使用客户端脚本的方法。 理解 JavaScript 语言的基本语法。 理解 JavaScript 对象和浏览器对 象在脚本编程中的作用。 理解 DHTML 的原理,能够在网页 中应用 DHTML.
Advertisements

任务三:子页面设计与交 互页面制作. 任务 3-1 :模板和库文件的应用 用模板建立站点库文件的应用.
熟悉 Dreamweaver 的工作區與基本操作
广州市小学信息技术教学同步资源 第一册 第二章 第六节 《 Window窗口》 广州市荔湾区西华路小学 董绮珊.
第六 章数据库访问页 6.1 数据访问页视图 6.2 创建数据访问页 6.3 编辑数据访问页 6.4 查看数据访问页 退出.
项目2 字符格式和段落编排 2017年3月7日6时54分.
插入超链接 高邮市第一实验小学 范太国 任务一:设置文本超链接 任务一:设置文字超链接 步骤:1、选定文字并右击,在快捷菜单 中选择“超链接”命令。 2、在弹出的对话框中选择左侧“链接到:”中的“本文档中的位置(A)”项,在“请选择文档中的位置(C):”中选择需要链接的幻灯片,单击“确定”按钮。
案例2 胸卡的制作. 案例2 胸卡的制作 知识要点: 学习重点及制作思路 学习目的: 邀请函的制作步骤: 1.掌握邮件合并功能 2.掌握比较并合并文档方法 3.掌握页面插入背景图 4.熟练使用文本框 知识要点: 1.邮件合并功能 2.文档中插入域内容 3.文本框的使用 技能要点: 1.域、文档部件操作.
UI(用户界面)集训班 Illustrator 高级班.
有序列表.
第6章 制作网站链接 本章内容 练习思考 实验操作.
数据访问页.
在PHP和MYSQL中实现完美的中文显示
网页设计 上海建桥学院信息技术系 矫桂娥
第11章 行 为.
武汉纺织大学传媒学院 cm.wtu.edu.cn
第八章 菜单设计 §8.1 Visual FoxPro 系统菜单 §8.2 为自己的程序添加菜单 §8.3 创建快捷菜单.
第二單元:Dreamweaver的基本操作
计算机网络与网页制作 Chapter 18:用行为增加页面的互动
大学计算机基础 典型案例之一 构建FPT服务器.
Ebooking 突发问题解决方案.
网络常用常用命令 课件制作人:谢希仁.
第11章:一些著名开源软件介绍 第12章:服务安装和配置 本章教学目标: 了解当前一些应用最广泛的开源软件项目 搭建一个网站服务器
网页设计与制作 网页基本标签(三) 北京农业职业学院刘丽霞.
供应商登录CJLR SRM系统入口 CJLR供应商仅可以在互联网上访问SRM系统,无法在CJLR内网登录SRM系统.
VSS使用简介 王树升
网页制作基础 CNIC 王桦.
点击此处添加标题 01 点击此处添加标题 点击此处添加标题 点击此处添加标题 点击此处添加标题 点击此处添加标题 点击此处添加标题
PRESENTED BY OfficePLUS
第2章 初识Dreamweaver CS4 Adobe Dreamweaver CS4是建立Web站点和应用程序的 专业工具。它将可视布局工具、应用程序开发功能和 代码编辑支持组合在一起,其功能强大,使得各个层 次的开发人员和设计人员都能够快速创建界面吸引人 的基于标准的网站和应用程序。从对基于CSS的设计.
任务1-3 使用Dreamweaver创建ASP网页
宁波市高校慕课联盟课程 与 进行交互 Linux 系统管理.
宁波市高校慕课联盟课程 与 进行交互 Linux 系统管理.
UI 软件 设计 页面布局(三).
A New Kind of JavaScript Library
点击此处添加标题 TEXT TEXT TEXT TEXT TEXT
编程作业3:网页正文抽取 (10分).
十 三.使用模板和库.
产品推广 PRODUCT PROMOTION PRESENTED BY OfficePLUS.
标准配色方案 背景 文本和线条 阴影 强调色 主色一 主色二 主色三 主色四 推荐应用顺序. 标准配色方案 背景 文本和线条 阴影 强调色 主色一 主色二 主色三 主色四 推荐应用顺序.
PRESENTED BY OfficePLUS
姚金宇 MIT SCHEME 使用说明 姚金宇
海南医学院附属医院 The Affiliated Hospital of Hainan Medical College 科研信息管理平台上线
计算机网络与网页制作 Chapter 07:Dreamweaver CS5入门
项目二:HTML语言基础.
iSIGHT 基本培训 使用 Excel的栅栏问题
PPT中视频的播放控制 苏州电教馆在线课程培训教程:PPT2003教程   制作:赵立锋 更多教程请见:
JoVE实验视频期刊用户指南.
第六章 素材的加工与处理 第13讲 用GoldWave进行音频的截取、合并、淡入淡出操作
Visual Basic程序设计 第13章 访问数据库
VRP教程 2011.
Delphi 7.0开发示例.
SCI收录号查询方法介绍 上海大学情报研究所
报头 的制作.
第9章 多媒体技术 掌握 Windows 画图工具的基本操作; 掌握 Windows 音频工具进行音频播放;
Python 环境搭建 基于Anaconda和VSCode.
Polarization of electro- magnetic wave after reflection
武汉纺织大学传媒学院 cm.wtu.edu.cn
《手把手教你学STM32-STemWin》 主讲人 :正点原子团队 硬件平台:正点原子STM32开发板 版权所有:广州市星翼电子科技有限公司
翻转学习 穿越雾霾 ——小锐作业介绍.
基于列存储的RDF数据管理 朱敏
YOUR SUBTITLE GOES HERE
项目:交互式网页 义乌工商学院机电信息分院省级精品课程.
第8章 创建与使用图块 将一个或多个单一的实体对象整合为一个对象,这个对象就是图块。图块中的各实体可以具有各自的图层、线性、颜色等特征。在应用时,图块作为一个独立的、完整的对象进行操作,可以根据需要按一定比例和角度将图块插入到需要的位置。 2019/6/30.
第四章 UNIX文件系统.
使用ADO访问数据库 李宝智 BonizLee 课程 10564A
创建、启动和关闭Activity 本讲大纲: 1、创建Activity 2、配置Activity 3、启动和关闭Activity
使用Fragment 本讲大纲: 1、创建Fragment 2、在Activity中添加Fragment
LOGO HERE 单击此处添加 您的标题标题标题 PRESENTED BY JANE DOE
FPGA系统设计与实践 本章小结(第5章).
Presentation transcript:

十.行为

十.行为 第8章 行为设置 1.掌握行为面板的使用方法 2.认识常用事件及其意义 3.掌握DW内置动作的使用方法 4.Spry框架的使用

十.行为 网上各种纷繁多样的动态交互式网页效果非常吸引, 可作为刚刚入门的网页制作者,对网页编程还不是很 熟悉,而这些交互效果很多都需要具有Javascript知 识。在DW中,内置了强大的行为面板。使用DW行为, 普通的网页设计者也可以做出复杂的动态网页。 行为是指在网页中进行的一系列动作,通过这些动 作,可以实现用户同网页的交互,也可以通过动作使某个任务被执行。

十.行为 行为由事件Event和动作Action两个基本元素组成。通 过事件的响应进而执行对应的动作。 ① 通常,动作是一段Javascript代码,利用这些代码可以完成相应的任务。例如打开浏览器、播放声音等。 ②事件则是由浏览器所定义,它可以被附加到各种页面元素上,也可以被附加到HTML标记中,并且一个事件总是针对页面元素或标记而言的。例如onMouseOver,onMouseOut等,它们在大多数浏览器中和链接相关联,而onLoad则是和图像以及文档正文相关联的事件。

十.行为 1.认识行为面板 “窗口”->“行为”把行为面板调出来 2.为对象附加行为 在DW中,可以将行为附加给整个文档、链接、图像、 表单元素或其他任何HTML元素,并由浏览器决定哪些 元素可以接受行为,哪些元素不能接受行为。在为对 象附加动作时,可以一次为每个事件关联多个动作, 并按照行为面板的动作列表中的顺序执行动作。

十.行为 通常在DW中创建一个行为的步骤: 1)选择一个特定的元素,如文本链接或一个图片等 等。行为将被附加到此特定的元素上。 2)点击行为面板上的添加按钮(+),打开可选动作 菜单列表。 3)在菜单选择“显示事件”,在里面选择希望兼容的浏 览器,如可以选择IE5.0、IE5.5等。

十.行为 4)选择好“显示事件”后,在刚才的动作列表菜单中选 择希望执行的动作。当选择动作后,将弹出一个参 数对话框,设置好参数。(这里简单任选一动作) 注意:不同版本的浏览器,支持的事件也是不同的。 在刚才下拉列表的“显示事件”中选择希望兼容的浏览 器,这样到时显示出来的事件也会不一样。 5)这时在行为面板中将显示添加的事件和对应的动作 6) 如果该事件不是希望的事件,可单击事件列表中的 箭头,选择其它事件。

十.行为 注意问题: 留意面板上面的“标签”的变化,特别注意文本的变化 为文本附加行为: 在DW中,不能为纯文本附加行为。但是可以为链接文本附加行为。因此,要给纯文本附加行为,可以先给文本添加一个空链接(#)。

十.行为 3.行为实例(书本基础是实例操作) 弹出提示信息 打开浏览器窗口 显示隐藏元素 拖到AP元素 设置文本 设置效果(增大/收缩、挤压、晃动、高亮颜色等)

十.行为 播放声音 插入音乐有多种方法,如:使用插件、控件、代码都可以实现 方法1: (1)“插入栏-媒体-插件”插入一声音文件 (2)选中声音文件,在属性面板选择“参数” (3)添加如书本P171的参数和值 -hidden true/false -loop n/true/false (n次数,-1=true) -autoplay true/false -controller true/false

十.行为 方法2:代码法 <embed src=“文件名.mid" autostart="false" loop="true"width="300"height="45" ></embed> src=“****.mid” 指定音乐文件的路径与文件名。最好用相对路径(目前就是相对路径)。    autostart=“****”设定当音乐文件载入后是否自动播放。有两个逻辑选项,true和 false。    Loop=“****” 表示音乐文件是否循环播放,也可以指定循环播放的次数。比如 loop=“3”表示重复播放3次,loop=“-1”表示无限循环,loop="true"也表示无限循环。 width=“***”height=“**”表示显示控制面板的宽和高,当两个参数均设为0时,表示隐藏控制面板。

十.行为 方法3:行为的方法为具体对象加载声音 (1)背景音乐:选定body标签 播放声音行为+onload的配合 (2)对其它对象添加声音的话就是要选定对象, 再添加播放声音行为

十.行为 方法4:插入背景音乐还可以通过下面方法 <body></body>标签之间插入 <bgsound src="music.mid" loop="-1"> src=“music.mid”是指定背景音乐文件的位置及文件名。 Loop=“-1”代表背景音乐循环 播放,你也可以指定播放次数。 这种插入背景音乐的方法简单,但是只适用于IE浏览器。也不 易控制,没法关闭。

十.行为 如果只是要提供东西下载呢? 供别人下载的文件设置方法:  除了ZIP、RAR、EXE类型文件以外,凡是不被浏览器识别的格式文件作为链接目标时, 浏览器默认的操作都是下载。所以,您只要把相关文件的链接路径写准确,告诉浏览者即可。

十.行为 Spry框架:Adobe公司出的一组Ajax(Javascript)效果框架 注意事项 1.书本有时乱用Spry这一概念,讲到Spry的时候其 实没用到Spry功能。 2.Spry的样式修改(对应的样式表CSS文件)及动作 修改(对应的JS文件):两个对应的文件

堂上练习 练习书本例子 P176-P180 8.4.5 进阶实例--利用行为使网页内容更加精彩

十.行为 1.Spry选项卡式面板 2.Spry菜单栏 即“弹出菜单”,CS3版本不推荐使用旧方法(指行为面板里面的弹出菜单) 第14章 制作弹出式导航菜单 3.Spry折叠式 第15章 制作滑动折叠 4.Spry可折叠面板 自己练习 看跟折叠式有什么区别

十.行为 Spry选项卡式面板 修改默认JS事件,默认是点击(onTabClick) 其它几个Spry找到相应的事件进行修改 Spry.Widget.TabbedPanels.prototype.onTabMouseOver = function(e, tab) { this.showPanel(tab); }; 其它几个Spry找到相应的事件进行修改