首页 > 设计 > 实用代码 > 正文

仿企业QQ客服在线咨询悬浮框特效代码

2020-01-27 13:40:02

字体：大中小

来源：转载

供稿：网友

刚刚扒的一个企业QQ客服悬浮框的代码，需要修改的地方都注释了，自己在用的时候再给他添加一个悬浮的css即可，已经设置好定时出现和滚动标题。

企业QQ,QQ客服,QQ在线客服,QQ客服代码

<style type="text/css">* { padding:0; margin:0; font-family:Microsoft YaHei,Simsun;}.main {display:none;width:327px;height:172px; background-repeat:no-repeat;}.bg { background-image:url(http://s-api.yunvm.com/young/bg.png)}.btn { position:absolute; display:block;}.launchBtn { top:145px; left:173px; width:69px; height:22px;}.laterBtn { top:145px; left:248px; width:69px; height:22px;}.closeBtn { top:0;left: 283px;; width:39px; height:26px;}.title { position:absolute; top:1px; left:17px; height:30px; line-height:30px; font-size:16px; color:#000;}.content { position:absolute; top:45px; left:114px; width:203px; height:85px;}.content .msg { font-size:12px; color:#000; line-height:25px;}</style><div class="main bg" id="qqlos" width="327px;"><a id="launchBtn" class="launchBtn btn" href="javascript:qqtalk();"></a><a id="laterBtn" class="laterBtn btn" href="javascript:hide();"></a><a id="closeBtn" class="closeBtn btn" href="javascript:hide();"></a><p id="title" class="title">在线咨询</p><div class="content"><p id="msg" class="msg">您好，请问有什么可以帮到您？请接受聊天邀请。</p></div></div><script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script><script>$(function(){/*定时显示这个客服框1秒=1000*/setTimeout('show()',10000);});function qqtalk(){/*自行替换652314794为自己的QQ*/window.open("http://wpa.qq.com/msgrd?v=3&uin=652314794&site=qq&menu=yes");}function hide(){document.getElementById('qqlos').style.display='none';}function show(){document.getElementById('qqlos').style.display='block';/*滚动标题*/var s="【你有一条新消息】".split("");function func(){s.push(s[0]);s.shift();document.title = s.join("");}/*滚动速度*/setInterval(func,1000);}</script>

上一篇：一段让访客自动加自己为QQ好友代码

下一篇：CSS3实现动态404错误页面特效效果

学习交流

phpwind的rewrite重写原理

phpwind的rewrite重写原理...

热门图片

猜你喜欢的新闻

猜你喜欢的关注

新闻热点

小米10首发骁龙865 售价或超3500元

2020-01-26 17:36:10

刘炽平亲述腾讯投资风向小程序生态影响投资决策

2020-01-21 18:22:08

达沃斯前瞻：阿里巴巴董事局主席张勇谈平台经济普惠之道

2020-01-21 18:18:48

Redmi K30 5G全部配色版本开卖售价1999元起

2020-01-21 18:13:08

传华为Mate40Pro摄像头或采用全新设计像素提升至6000万

2020-01-21 18:09:29

谷歌Pixel4已跑上Android11

2020-01-20 20:02:27

疑难解答

图片精选

网友关注