基于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 相关文章推荐
解决IE下select标签innerHTML插入option的BUG(兼容IE,FF,Opera,Chrome,Safari)
May 13 Javascript
这段js代码得节约你多少时间
Dec 20 Javascript
jquery实现经典的淡入淡出选项卡效果代码
Sep 22 Javascript
jQuery Validate插件实现表单强大的验证功能
Dec 18 Javascript
JS添加或修改控件的样式(Class)实现方法
Oct 15 Javascript
使用vue框架 Ajax获取数据列表并用BootStrap显示出来
Apr 24 Javascript
实现jquery放大镜的两种方法
Feb 22 jQuery
在小程序中使用腾讯视频插件播放教程视频的方法
Jul 10 Javascript
在iFrame子页面里实现模态框的方法
Aug 17 Javascript
微信小程序如何调用新闻接口实现列表循环
Jul 02 Javascript
js实现一款简单踩白块小游戏(曾经很火)
Dec 02 Javascript
利用H5api实现时钟的绘制(javascript)
Sep 13 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+mysql分页代码详解
2008/03/27 PHP
php函数重载的替代方法--伪重载详解
2015/05/08 PHP
php通过执行CutyCapt命令实现网页截图的方法
2016/09/30 PHP
php中__toString()方法用法示例
2016/12/07 PHP
PHP中“=&gt;
2019/03/01 PHP
PHP8.0新功能之Match表达式的使用
2020/07/19 PHP
jQuery实现的立体文字渐变效果
2010/05/17 Javascript
javascript 中String.match()与RegExp.exec()的区别说明
2013/01/10 Javascript
js模拟滚动条(横向竖向)
2013/02/22 Javascript
查询json的数据结构的8种方式简介
2014/03/10 Javascript
JS模拟实现Select效果代码
2015/09/24 Javascript
Bootstrap中CSS的使用方法
2016/02/17 Javascript
js es6系列教程 - 基于new.target属性与es5改造es6的类语法
2017/09/02 Javascript
9种使用Chrome Firefox 自带调试工具调试javascript技巧
2017/12/22 Javascript
解决vue打包之后静态资源图片失效的问题
2018/02/21 Javascript
vue.js中toast用法及使用toast弹框的实例代码
2018/08/27 Javascript
自己动手封装一个React Native多级联动
2018/09/19 Javascript
详解如何制作并发布一个vue的组件的npm包
2018/11/10 Javascript
[00:49]完美世界DOTA2联赛10月28日开团时刻:随便打
2020/10/29 DOTA
python xml.etree.ElementTree遍历xml所有节点实例详解
2016/12/04 Python
Python配置mysql的教程(推荐)
2017/10/13 Python
Python调用钉钉自定义机器人的实现
2020/01/03 Python
Tensorflow进行多维矩阵的拆分与拼接实例
2020/02/07 Python
pytorch dataloader 取batch_size时候出现bug的解决方式
2020/02/20 Python
执行Python程序时模块报错问题
2020/03/26 Python
使用Django清空数据库并重新生成
2020/04/03 Python
完美解决pycharm 不显示代码提示问题
2020/06/02 Python
python中def是做什么的
2020/06/10 Python
如何让python的运行速度得到提升
2020/07/08 Python
通过Django Admin+HttpRunner1.5.6实现简易接口测试平台
2020/11/11 Python
PHP如何去执行一个SQL语句
2016/03/05 面试题
实习生的自我鉴定范文欣赏
2013/11/20 职场文书
大学同学聚会邀请函
2014/01/29 职场文书
企业年度评优方案
2014/06/02 职场文书
干货:如何写好观后感 !
2019/05/21 职场文书
创业计划书之面包店
2019/09/17 职场文书