基于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动态呼叫函数(两种方式)
May 03 Javascript
jQuery阻止事件冒泡具体实现
Oct 11 Javascript
JS 仿腾讯发表微博的效果代码
Dec 25 Javascript
JavaScript使用push方法添加一个元素到数组末尾用法实例
Apr 06 Javascript
浅谈Jquery为元素绑定事件
Apr 27 Javascript
浅谈Angularjs link和compile的使用区别
Oct 21 Javascript
JS库中的Particles.js在vue上的运用案例分析
Sep 13 Javascript
JavaScript的Object.defineProperty详解
Jul 09 Javascript
vue+echarts实现动态绘制图表及异步加载数据的方法
Oct 17 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
Jul 10 jQuery
js实现简单的日历显示效果函数示例
Nov 25 Javascript
如何用JS实现简单的数据监听
May 06 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中json_encode、json_decode与serialize、unserialize的性能测试分析
2010/06/09 PHP
基于在生产环境中使用php性能测试工具xhprof的详解
2013/06/03 PHP
php使用gd2绘制基本图形示例(直线、圆、正方形)
2017/02/15 PHP
尽可能写&quot;友好&quot;的&quot;Javascript&quot;代码
2007/01/09 Javascript
js 单引号 传递方法
2009/06/22 Javascript
获取body标签的两种方法
2011/10/13 Javascript
jQuery cdn使用介绍
2013/05/08 Javascript
原生js获取宽高与jquery获取宽高的方法关系对比
2014/04/04 Javascript
js实现的四级左侧网站分类菜单实例
2015/05/06 Javascript
jQuery实现的AJAX简单弹出层效果代码
2015/11/26 Javascript
基于JavaScript实现弹出框效果
2016/02/19 Javascript
关于JS中的方法是否加括号的问题
2016/07/27 Javascript
jQuery中animate的几种用法与注意事项
2016/12/12 Javascript
vue-resourse将json数据输出实例
2017/03/08 Javascript
echarts学习笔记之图表自适应问题详解
2017/11/22 Javascript
详解如何实现一个简单的Node.js脚手架
2017/12/04 Javascript
详解vue 兼容IE报错解决方案
2018/12/29 Javascript
ES6 如何改变JS内置行为的代理与反射
2019/02/11 Javascript
微信小程序利用swiper+css实现购物车商品删除功能
2019/03/06 Javascript
Layui实现数据表格默认全部显示(不要分页)
2019/10/26 Javascript
Angular封装表单控件及思想总结
2019/12/11 Javascript
Python实现确认字符串是否包含指定字符串的实例
2018/05/02 Python
django传值给模板, 再用JS接收并进行操作的实例
2018/05/28 Python
python使用pygame框架实现推箱子游戏
2018/11/20 Python
运用Python的webbrowser实现定时打开特定网页
2019/02/21 Python
django template实现定义临时变量,自定义赋值、自增实例
2020/07/12 Python
Python 的 __str__ 和 __repr__ 方法对比
2020/09/02 Python
德国专业木制品经销商:Holz-Direkt24
2019/12/26 全球购物
往来会计岗位职责
2013/12/19 职场文书
竟聘演讲稿范文
2013/12/31 职场文书
大学自我评价
2014/02/12 职场文书
元旦联欢会策划方案
2014/06/11 职场文书
自荐信模板大全
2015/03/27 职场文书
初中体育教学随笔
2015/08/15 职场文书
css背景和边框标签实例详解
2021/05/21 HTML / CSS
【海涛教你打DOTA】黑鸟第一视角解说
2022/04/01 DOTA