基于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打印iframe内容示例代码
Aug 20 Javascript
地址栏传递中文参数乱码在js里用escape转码
Aug 28 Javascript
把字符串按照特定的字母顺序进行排序的js代码
Jan 28 Javascript
jQuery 写的简单打字游戏可以提示正确和错误的次数
Jul 01 Javascript
针对后台列表table拖拽比较实用的jquery拖动排序
Oct 10 Javascript
Node.js包管理器Yarn的入门介绍与安装
Oct 17 Javascript
jQuery插件WebUploader实现文件上传
Nov 07 Javascript
关于webpack代码拆分的解析
Jul 20 Javascript
在vue-cli搭建的项目中增加后台mock接口的方法
Apr 26 Javascript
vue-cli脚手架build目录下utils.js工具配置文件详解
Sep 14 Javascript
jquery+php后台实现省市区联动功能示例
May 23 jQuery
JavaScript canvas实现流星特效
May 20 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 代码优化的42条建议 推荐
2009/09/25 PHP
PhpMyAdmin中无法导入sql文件的解决办法
2010/01/08 PHP
PHP提示Cannot modify header information - headers already sent by解决方法
2014/09/22 PHP
PHP文件读写操作相关函数总结
2014/11/18 PHP
PHP统计当前在线用户数实例讲解
2015/10/21 PHP
php 7新特性之类型申明详解
2017/06/06 PHP
Laravel 的数据库迁移的方法
2017/07/31 PHP
基于CI(CodeIgniter)框架实现购物车功能的方法
2018/04/09 PHP
PHP 访问数据库配置通用方法(json)
2018/05/20 PHP
Yaf框架封装的MySQL数据库操作示例
2019/03/06 PHP
使用Apache的rewrite
2021/03/09 Servers
使用Firebug对js进行断点调试的图文方法
2011/04/02 Javascript
js Array对象的扩展函数代码
2013/04/24 Javascript
JS 在指定数组中随机取出N个不重复的数据
2014/06/10 Javascript
javascript限制文本框输入值类型的方法
2015/05/07 Javascript
javascript实现点击单选按钮链接转向对应网址的方法
2015/08/12 Javascript
每天一篇javascript学习小结(RegExp对象)
2015/11/17 Javascript
js 获取元素所有兄弟节点的实现方法
2016/09/06 Javascript
分分钟玩转Vue.js组件
2016/10/25 Javascript
Vue实现todolist删除功能
2018/06/26 Javascript
一些你可能不熟悉的JS知识点总结
2019/03/15 Javascript
Vue+Element实现表格编辑、删除、以及新增行的最优方法
2019/05/28 Javascript
vue通过video.js解决m3u8视频播放格式的方法
2019/07/30 Javascript
javascript/jquery实现点击触发事件的方法分析
2019/11/11 jQuery
jquery传参及获取方式(两种方式)
2020/02/13 jQuery
盘点提高 Python 代码效率的方法
2014/07/03 Python
在pandas中遍历DataFrame行的实现方法
2019/10/23 Python
Python for循环通过序列索引迭代过程解析
2020/02/07 Python
Python日志syslog使用原理详解
2020/02/18 Python
python shell命令行中import多层目录下的模块操作
2020/03/09 Python
python实现opencv+scoket网络实时图传
2020/03/20 Python
Python代码注释规范代码实例解析
2020/08/14 Python
用python实现一个简单计算器(完整DEMO)
2020/10/14 Python
html5 Canvas画图教程(5)—canvas里画曲线之arc方法
2013/01/09 HTML / CSS
医学生实习自荐信
2013/10/01 职场文书
2015年化验员工作总结
2015/04/10 职场文书