导航条——调用网页助手小精灵

Posted 柯南&

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了导航条——调用网页助手小精灵相关的知识,希望对你有一定的参考价值。

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();                                                               //调用并控制网页助手小精灵
}

 

以上是关于导航条——调用网页助手小精灵的主要内容,如果未能解决你的问题,请参考以下文章

导航到另一个片段时触发 API 调用

HTML下拉网页,导航条一直漂浮在顶端怎么做?

BootStrap实用代码片段(持续总结)

Android:如何在选项卡内从一个片段导航到另一个片段? [关闭]

Codeigniter 助手重复 HTML 代码片段

在片段的后按防止使用导航图调用前一个片段的 onViewCreated