基于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 相关文章推荐
js DOM的学习笔记
Dec 22 Javascript
jQuery学习笔记之jQuery构建函数的7种方法
Jun 03 Javascript
js实现局部页面打印预览原理及示例代码
Jul 03 Javascript
jQuery获得包含margin的outerWidth和outerHeight的方法
Mar 25 Javascript
Js得到radiobuttonlist选中值的两种方法(推荐)
Aug 25 Javascript
Vue.js双向绑定实现原理详解
Dec 22 Javascript
vue Render中slots的使用的实例代码
Jul 19 Javascript
Angular4开发解决跨域问题详解
Aug 28 Javascript
vue this.reload 方法 配置
Sep 12 Javascript
微信小程序开发问题之wx.previewImage
Dec 25 Javascript
layui实现tab的添加拒绝重复的方法
Sep 04 Javascript
关于vue表单提交防双/多击的例子
Oct 31 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面向对象编程快速入门
2006/12/14 PHP
php不用正则采集速度探究总结
2008/03/24 PHP
PHP调用MsSQL Server 2012存储过程获取多结果集(包含output参数)的详解
2013/07/03 PHP
ie 调试javascript的工具
2009/04/29 Javascript
javascript实现的距离现在多长时间后的一个格式化的日期
2009/10/29 Javascript
JS和Jquery获取和修改label的值的示例代码
2014/01/15 Javascript
jquery弹窗插件colorbox绑定动态生成元素的方法
2014/06/20 Javascript
AspNet中使用JQuery boxy插件的确认框
2015/05/20 Javascript
完美解决jQuery的hover事件在IE中不停闪动的问题
2017/02/10 Javascript
vue-cli中的webpack配置详解
2017/09/25 Javascript
微信小程序模板和模块化用法实例分析
2017/11/28 Javascript
JavaScript中click和onclick本质区别与用法分析
2018/06/07 Javascript
详解webpack编译速度提升之DllPlugin
2019/02/05 Javascript
解决layer 动态加载select 失效的问题
2019/09/18 Javascript
vue中利用three.js实现全景图的完整示例
2020/12/07 Vue.js
python通过函数属性实现全局变量的方法
2015/05/16 Python
Python基于pygame实现图片代替鼠标移动效果
2015/11/11 Python
用PyInstaller把Python代码打包成单个独立的exe可执行文件
2018/05/26 Python
python2和python3的输入和输出区别介绍
2018/11/20 Python
Pycharm设置utf-8自动显示方法
2019/01/17 Python
在Python中将函数作为另一个函数的参数传入并调用的方法
2019/01/22 Python
利用PyCharm Profile分析异步爬虫效率详解
2019/05/08 Python
Django User 模块之 AbstractUser 扩展详解
2020/03/11 Python
基于Python组装jmx并调用JMeter实现压力测试
2020/11/03 Python
深入解读CSS3中transform变换模型的渲染
2016/05/27 HTML / CSS
HTML5的video标签的浏览器兼容性增强方案分享
2016/05/19 HTML / CSS
世界上最悠久的自行车制造商:Ribble Cycles
2017/03/18 全球购物
匡威西班牙官网:Converse西班牙
2019/10/01 全球购物
输入一行文字,找出其中大写字母、小写字母、空格、数字、及其他字符各有多少
2016/04/15 面试题
导游的职业规划书范文
2013/12/27 职场文书
幼儿园儿童节主持词
2014/03/21 职场文书
幼儿园大班评语大全
2014/04/17 职场文书
微笑服务演讲稿
2014/05/13 职场文书
护士求职简历自我评价
2015/03/10 职场文书
2016三八妇女节校园广播稿
2015/12/17 职场文书
MySQL 存储过程的优缺点分析
2021/05/20 MySQL