浮动图标如何集成乐语，QQ、微博及微信等工具的方法

浮动图标如何集成乐语，QQ、微博及微信等工具的方法

备注：此方法适用于大多数客户需求，请网站开发人员按如下方式加入代码

1、美工做好自定义的在线图标样式，例下图：
2、配置乐语探头，将该探头的在线图标设置成在线不显示的状态，但是监测功能要开启。
3、做好自定义的在线图标的面板背景图，qq图片，微博图片以及乐语图片。
4、可以设置一个div标签，将该标签的背景图设置成面板背景图。<div id=”cs” style=”background-image(面板别URL) width:面板宽;height:面板高:”>
</div>

不管是放qq图片还是微博图片，都是需要2个步骤：放置图片以及加链接。
1、怎么加qq图片：
在上面的div中在套一个div标签，放置a标签，在该a标签中放入img标签，该img标签链接qq图标，点击该图片链接到qq客服（a标签的herf可以链接到qq客服，至于链接到qq客服的链接地址，需要客户技术人员自己生成）。
<div id=”qq” syle=”width:qq图片宽度px;height:qq图片高度px;”>
  <a href=”qq客服链接url” target=”_bank”><img src=”qq图片地址” /></a>
</div>
2、怎么加微博：
加微博的标签，放置图片的步骤和加qq图片相同。
放置微博标签的链接只要让a标签的herf指向微博地址即可，微博地址也需要客户自己生成。
<div id=”weibo” syle=”width:weibo图片宽度px;height:weibo图片高度px;”>
  <a href=”weibo链接url” target=”_bank”><img src=”weibo图片地址” /></a>
</div>

3、在面板中加入乐语：
放置图片过程如上述步骤：
至于链接到乐语客服，提供两种方法：
第一种是在a标签的href指向乐语固定链接；
<a href=”乐语固定链接” target=”_bank”><img src=”乐语图片地址”></a>
第二种方法是在onclick事件中调用乐语的doyoo.util.openChat(gid)的函数（这个函数必须得嵌入乐语的监测代码才可以，gid为分组id）。
<a href=”#” onclick=”doyoo.util.openChat(gid)”><img src=”乐语图片地址”></a>


然后讲设置的div层浮动在网页上就行了。下面是给出的其中的一种显示浮动的方法：
<script language="javascript" type="text/javascript">
var MarginLeft = 30;   //浮动层离浏览器右侧的距离
var MarginTop = 100;     //浮动层离浏览器顶部的距离
var Width = 80;        //浮动层宽度
var Heigth= 309;        //浮动层高度

//设置浮动层宽、高
function Set()
{
    document.getElementById("浮动层divID").style.width = Width;
    document.getElementById("浮动层divID").style.height = Heigth;
}

//实时设置浮动层的位置
function Move()
{
document.getElementById("浮动层divID").style.top = document.documentElement.scrollTop + MarginTop;
document.getElementById("浮动层divID").style.left = document.documentElement.clientWidth - Width - MarginLeft;
setTimeout("Move();",100);
}

Set();
Move();
</script>

以上为我公司技术人员写的代码案例，如有任何疑问，请随时联系我公司开发人员：热线010-62984908-878     4000-789-818