jquery实现右侧悬浮客服中心多个qq客服聊天效果代码

代码语言:html

所属分类:其他

代码描述:jquery实现右侧悬浮客服中心多个qq客服聊天效果代码

代码标签: 悬浮 客服中心 多个 qq 客服 聊天 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!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" />
    <style>
        /*默认蓝色*/
    .SonlineBox{ width:162px; font-size:12px;overflow:hidden; z-index:9999;}
    .SonlineBox .openTrigger{ width:30px; height:110px; position:absolute; top:0px;  z-index:1; cursor:pointer;  background:#0176ba url(//repo.bfw.wiki/bfwrepo/images/kefu/openTrigger.jpg) no-repeat;}
    .SonlineBox .titleBox{ width:158px; height:35px; line-height:35px; background:#038bdc url(//repo.bfw.wiki/bfwrepo/images/kefu/SonlineTitleBg.gif) repeat-x; border-bottom:2px solid #0176ba;}
    .SonlineBox .titleBox span{ margin-left:10px; color:#fff; font-size:14px; font-family:'微软雅黑','黑体';}
    .SonlineBox .contentBox{ width:158px; height:auto; border:2px solid #0176ba; background:#fff; position:absolute; z-index:2;}
    .SonlineBox .contentBox .closeTrigger{ width:25px; height:25px; display:block; cursor:pointer;  position:absolute; top:5px;right:5px;-webkit-transition:all 0.8s ease-out;}
    .SonlineBox .contentBox .closeTrigger:hover{-webkit-transform:scale(1) rotate(360deg);}
    .SonlineBox .contentBox .listBox{overflow:hidden; margin-bottom:10px;}
    .SonlineBox .contentBox .listBox .QQList{ display:block; width:86%; height:22px; margin:10px auto 0px auto;}
    .SonlineBox .contentBox .listBox .QQList span{float:left; line-height:22px;}
    .So.........完整代码请登录后点击上方下载按钮下载查看

网友评论0