网页右侧悬浮在线QQ客服系统代码

电影魔童 2019-11-22 62 阅读

特效描述:利用js实现 网页右侧 QQ悬浮 在线客服,利用js实现网页右侧QQ悬浮在线客服

代码部署教程

1. 引入CSS

<link rel="stylesheet" href="style/cs_q.css" type="text/css"/>

<link rel="stylesheet" href="style/cs_q.css" type="text/css"/>

2. 引入JS

<script type="text/javascript" src="js/cs_q.js"></script>

<script type="text/javascript" src="js/cs_q.js"></script>

3. HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title></title>
<div id= 'qq_icon'></div>
<div id='cs_online'>
<ul class='qq_context'>
<li>
<span class='span_t'>在线客服01:</span>
<span class='qq_num'></span>
</li>
<li>
<span class='span_t'>在线客服02:</span>
<span class='qq_num'></span>
</li>
<li>
<span class='span_t'>在线客服03:</span>
<span class='qq_num'></span>
</li>
<li>
<span class='span_t'>在线客服04:</span>
<span class='qq_num'></span>
</li>
<li>
<span class='span_t'>在线客服05:</span>
<span class='qq_num'></span>
</li>
</div>
</div>
<script type="text/javascript">
myEvent(window,'load',function(){
dealy('qq_icon',2); //2秒后显示QQ图标,默认为2秒,可自行设置
settop('qq_icon','cs_online',150); //设置在线客服的高度,默认150,可自行设置
var span_q = getbyClass('cs_online','qq_num');
setqq(span_q,['800020304','800020304','800020304','800020304','800020304']); //填写5个QQ号码
click_fn('qq_icon','cs_online');
});
</script>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>
</body>
</html>

演示地址下载地址

最新游戏