基于JS实现导航条之调用网页助手小精灵的方法


Posted in Javascript onJune 17, 2016

1.概述

     在网站中加入网页助手小精灵,当用户访问网站时,向用户问好,或是传递一些网站的重要信息,不仅可以帮助用户快速了解网站,而且可以让用户对该网站留下深刻的印象。本实例将介绍通过JavaScript调用网页助手小精灵的方法。

2.技术要点

本实例主要通过Microsoft的ActiveX组件Microsoft Agent实现。Microsoft Agent提供了很多控制Agent角色的方法,下面进行详细介绍。

a. Load()方法:用于读入要使用的角色,该方法包括两个参数,一个用于指定角色的姓名,另一个用于指定角色存储的文件。

b. Show()方法:用于使角色显示在屏幕上。

c. Hide()方法:用于隐藏角色。

d. Speak()方法:用于实现角色说话,该方法有一个参数,用于指定说话的内容。

e. MoveTo ()方法:用于将角色移动到屏幕的指定位置,该方法有两个参数,一个用于指定x轴的坐标,另一个用于指定y轴的坐标。

f. Play()方法:用于指定要播放的动画,该方法只有一个参数,用于指定表示动画的字符串,其值包括Announce、Explain、Congratulate、greet、Gestureright、Gestureleft、Gesturedown、Gestureup、Pleased和Read等。

3.具体实现

(1)在需要显示网页助手小精灵的页面的<head>标记中,编写自定义的JavaScript函数loadAgent(),用于装入要使用的角色。loadAgent()函数的具体代码如下:

<script language="javascript">
function loadAgent(id){ 
   try{ 
      id=new ActiveXObject("Agent.Control.2");             //创建一个ActiveX控件
      id.Connected = true; 
      id.Characters.Load("MrAgent","merlin.acs");               //装入要使用的角色
      return id; 
   }catch (err){ 
      return false; 
   } 
}
</script>

(2)loadAgent()函数的后面编写一个自定义的JavaScript函数controlAgent(),用于调用并控制网页助手小精灵,controlAgent()函数的具体代码如下:

function controlAgent(){ 
   if (agent=loadAgent("agent")){ 
      var mrAgentID="MrAgent"; 
      mrAgent = agent.Characters.Character(mrAgentID);         //获取助手对象
      mrAgent.MoveTo(200,200);                       //移动助手
      mrAgent.Show();                           //显示助手
      mrAgent.Play("Explain");                         //做解释的手势
      mrAgent.Speak("欢迎来到明日科技网站!");             //提示语
      mrAgent.Play("Gestureright");                         //右手做手势
      mrAgent.Play("Pleased");                         //做请的手势
      mrAgent.Speak("我们的网址:www.cccxy.com");         //提示语
      mrAgent.Hide();                            //隐藏助手
      mrAgent.MoveTo(600,300);                       //移动助手
      mrAgent.Show();                               //显示助手
      mrAgent.Play("Explain");                         //做解释的手势      
      mrAgent.Play("Read")                            //作出读书的动作     
      mrAgent.Speak("我们会热心解决您学习过程中遇到的疑问"); //提示语
      mrAgent.Play("Idle1_1");                         //做出无所事事的样子 
      mrAgent.Play("Gestureright");                         //右手做手势        
      mrAgent.Speak("记住我们的网址:www.cccxy.com");         //提示语
      mrAgent.Play("greet");                           //问候
      mrAgent.Speak("感谢您的到来");                      //提示语 
      mrAgent.Play("Idle2_2");                         //做出无所事事的样子        
      mrAgent.Hide();                               //隐藏助手
   } 
}

(3)编写JavaScript代码,实现在页面载入后调用并控制网页助手小精灵,具体代码如下:

window.onload=function(){
   controlAgent();                                //调用并控制网页助手小精灵
}

以上所述是小编给大家介绍的基于JS实现导航条之调用网页助手小精灵的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JavaScript 字符串乘法
Aug 20 Javascript
JS 文件传参及处理技巧分析
May 13 Javascript
datagrid框架的删除添加与修改
Apr 08 Javascript
浅谈Unicode与JavaScript的发展史
Jan 19 Javascript
jquery ajax 如何向jsp提交表单数据
Aug 23 Javascript
js实现拖拽效果(构造函数)
Dec 14 Javascript
微信小程序 轮播图swiper详解及实例(源码下载)
Jan 11 Javascript
多个上传文件用js验证文件的格式和大小的方法(推荐)
Mar 09 Javascript
JavaScript数据结构之二叉树的计数算法示例
Apr 13 Javascript
vue.js配合$.post从后台获取数据简单demo分享
Aug 11 Javascript
基于Vue 服务端Cookies删除的问题
Sep 21 Javascript
vue cli3.0 引入eslint 结合vscode使用
May 27 Javascript
基于JS实现导航条flash导航条
Jun 17 #Javascript
基于JS代码实现导航条弹出式悬浮菜单
Jun 17 #Javascript
Javascript中的数组常用方法解析
Jun 17 #Javascript
iframe中使用jquery进行查找的方法【案例分析】
Jun 17 #Javascript
JS检测页面中哪个HTML标签触发点击事件的方法
Jun 17 #Javascript
jquery.qtip提示信息插件用法简单实例
Jun 17 #Javascript
jQuery实现区域打印功能代码详解
Jun 17 #Javascript
You might like
php生成随机数或者字符串的代码
2008/09/05 PHP
php读取二进制流(C语言结构体struct数据文件)的深入解析
2013/06/13 PHP
深入Apache与Nginx的优缺点比较详解
2013/06/17 PHP
jQuery+PHP+ajax实现微博加载更多内容列表功能
2014/06/27 PHP
destoon数据库表说明汇总
2014/07/15 PHP
分享8个Laravel模型时间戳使用技巧小结
2020/02/12 PHP
ext jquery 简单比较
2010/04/07 Javascript
Javascript公共脚本库系列(一): 弹出层脚本
2011/02/24 Javascript
20个最新的jQuery插件
2012/01/13 Javascript
教你JS中的运算符乘方、开方及变量格式转换
2016/08/09 Javascript
Bootstrap中的Dropdown下拉菜单更改为悬停(hover)触发
2016/08/31 Javascript
ES2015 Symbol 一种绝不重复的值
2016/12/25 Javascript
原生JS写Ajax的请求函数功能
2017/12/22 Javascript
vue js秒转天数小时分钟秒的实例代码
2018/08/08 Javascript
webpack file-loader和url-loader的区别
2019/01/15 Javascript
详解mpvue中小程序自定义导航组件开发指南
2019/02/11 Javascript
layui在form表单页面通过Validform加入简单验证的方法
2019/09/06 Javascript
node.js中npm包管理工具用法分析
2020/02/14 Javascript
在Vue 中实现循环渲染多个相同echarts图表
2020/07/20 Javascript
vue+elementui通用弹窗的实现(新增+编辑)
2021/01/07 Vue.js
Python编写电话薄实现增删改查功能
2016/05/07 Python
使用pyecharts无法import Bar的解决方案
2020/04/23 Python
对变量赋值的理解--Pyton中让两个值互换的实现方法
2017/11/29 Python
浅谈python在提示符下使用open打开文件失败的原因及解决方法
2018/11/30 Python
Python基于matplotlib画箱体图检验异常值操作示例【附xls数据文件下载】
2019/01/07 Python
python3调用windows dos命令的例子
2019/08/14 Python
序列化Python对象的方法
2020/08/01 Python
测绘工程个人的自我评价
2013/11/10 职场文书
专业技术职务聘任书
2014/03/29 职场文书
学生党员公开承诺书
2014/05/28 职场文书
个人反四风对照检查材料思想汇报
2014/09/23 职场文书
大学生学年个人总结
2015/02/15 职场文书
喋血孤城观后感
2015/06/08 职场文书
党员身份证明材料
2015/06/19 职场文书
2016年小学端午节活动总结
2016/04/01 职场文书
对Keras自带Loss Function的深入研究
2021/05/25 Python