在 Dreamweaver 文档的“设计”或“代码”视图中,选择要对其应用 jQuery 效果的元素。
上次更新日期:
2021年4月29日
- Dreamweaver 用户指南
- 简介
- Dreamweaver 和 Creative Cloud
- Dreamweaver 工作区和视图
- 设置站点
- 管理文件
- 布局和设计
- CSS
- 页面内容和资源
- 设置页面属性
- 设置 CSS 标题属性和 CSS 链接属性
- 使用文本
- 查找和替换文本、标签和属性
- DOM 面板
- 在实时视图中编辑
- 在 Dreamweaver 中对文档编码
- 在“文档”窗口中选择和查看元素
- 在属性检查器中设置文本属性
- 对网页进行拼写检查
- 在 Dreamweaver 中使用水平线
- 在 Dreamweaver 中添加和修改字体组合
- 使用资源
- 在 Dreamweaver 中插入和更新日期
- 在 Dreamweaver 中创建和管理收藏资源
- 在 Dreamweaver 中插入和编辑图像
- 添加媒体对象
- 在 Dreamweaver 中添加视频
- 插入 HTML5 视频
- 插入 SWF 文件
- 添加音频效果
- 在 Dreamweaver 中插入 HTML5 音频
- 使用库项目
- 在 Dreamweaver 中使用阿拉伯语和希伯来语文本
- 链接与导航
- jQuery 构件和效果
- 对网站进行编码
- 关于在 Dreamweaver 中编码
- Dreamweaver 中的编码环境
- 设置编码偏好设置
- 自定义代码颜色
- 编写和编辑代码
- 代码提示和代码完成
- 折叠和展开代码
- 使用代码片段重用代码
- 使用 linting 检查代码
- 优化代码
- 在设计视图中编辑代码
- 使用页面的头内容
- 在 Dreamweaver 中插入服务器端包含
- 在 Dreamweaver 中使用标签库
- 将自定义标签导入 Dreamweaver
- 使用 JavaScript 行为(一般说明)
- 应用内置 JavaScript 行为
- 关于 XML 和 XSLT
- 在 Dreamweaver 中执行服务器端 XSL 转换
- 在 Dreamweaver 中执行客户端 XSL 转换
- 在 Dreamweaver 中为 XSLT 添加字符实体
- 设置代码格式
- 跨产品工作流
- 模板
- 移动设备和多屏幕
- 动态网站、页面和 Web 表单
- 以可视化方式生成应用程序
- 测试、预览和发布网站
- 疑难解答
使用炫酷的 jQuery 特效设计引人注目的网站。Dreamweaver 与 jQuery 相结合,无需编写任何代码,即可加入滑块等特效。
添加 jQuery 效果
-
-
选择“窗口”>“行为”以打开“行为”面板。
-
单击加号图标,单击“效果”,然后单击所需效果。
此时将显示包含所选效果的设置的自定义面板。
-
指定设置,例如将应用该效果的目标元素和效果的持续时间。
目标元素可以与您最初选择的元素相同,也可以是页面上的不同元素。例如,如果您希望用户单击元素 A 以隐藏或显示元素 B,则目标元素是 B。
-
若要添加多个 jQuery 效果,请重复以上步骤。
在您选择多重效果时,Dreamweaver 按这些效果在“行为”面板中的显示顺序中应用效果。若要更改效果的顺序,请使用面板顶部的箭头键。
Dreamweaver 会自动将相关代码插入您的文档。例如,如果已经选择“褪色”效果,则将插入以下代码:
- 外部文件引用实现 jQuery 效果所需的依赖文件:
<script src="jQueryAssets/jquery-1.7.2.min.js" type="text/javascript"></script><script src="jQueryAssets/jquery-ui-effects.custom.min.js" type="text/javascript"></script>
- 以下代码应用于正文标签中的元素:
<li id="earthFrm" onclick="MM_DW_effectAppearFade($('#earthForms'),'show','fade',1000)"> Earth Forms</li>
- 将随以下代码添加一个脚本标签:
<script type="text/javascript"> function MM_DW_effectAppearFade(obj,method,effect,speed) { obj[method](effect, {}, speed); }</script>
基于事件的 jQuery 效果
在应用 jQuery 效果时,默认会将该效果指定给 onClick 事件。可以使用“行为”面板更改效果的触发事件。
-
选择所需页面元素。
-
在“窗口” >“行为”面板中,单击“显示设置事件”图标。
-
单击对应于当前所应用效果的行。请注意,第一列将更改为一个下拉列表,其中列出可从中选择的事件。
-
单击所需事件。
删除 jQuery 效果
-
选择所需页面元素。
“行为”面板列出目前应用于所选页面元素的所有效果。
-
单击要删除的效果,然后单击“删除”图标。