特效介绍
jQuery客服在线，固定在页面右边，可以关闭，底部是返回顶部按钮。点击微信按钮(即建议按钮)，会弹出留言版，自带灰色遮罩。
使用方法
1、在head区域引入相关js和css代码：
01 | <script type="text/javascript" src="js/jquery.min.js"></script> |
02 | <link rel="stylesheet" href="css/public_index.css" /> |
03 | <style type="text/css"> |
04 | .box_os .os_x, .box_os .osqq, .ico_os, .ico_gt, .ico_pp, .osqq .qq{ background:url(images/kf.gif) no-repeat;} |
05 | .box_os{ height:auto; overflow:hidden; width:131px; position:fixed; right:0; top:44px; _position:absolute; z-index:9999;display:none;} |
06 | .box_os .os_x{ background-color:#f7f7f7; background-position:2px 2px; width:18px; height:20px; float:right; display:inline; cursor:pointer;} |
07 | .box_os .osqq{ width:129px; border:1px solid #D1D1D1; background-color:#fff; background-position:0 -120px; clear:both; padding:37px 0 8px 0; text-align:center;} |
08 | .box_os .osqq p{ height:auto; line-height:20px;width:129px; margin-top:8px;} |
09 | .box_os .osqq p strong{ color:#666;} |
10 | .box_os .osqq img{ padding:7px 0 3px 0;} |
11 | .box_os .osqq p em{ color:#999; display:block;} |
12 | .box_os .osqq p span{ color:#547816; display:block;} |
13 | .box_os .osqq .qq{ background-position:-140px -120px; display:block; width:99px; height:26px; margin:0 auto; margin-top:8px; cursor:pointer;} |
14 | .acbox{ width:130px; overflow:hidden;} |
15 | .acbox .ico_gt{ background-position:-60px 0; border:1px solid #299ec0; border-top:0; cursor:pointer; width:60px; height:33px; float:right;} |
16 | .acbox .ico_pp{ background-position:-60px -60px; border:1px solid #81b140; border-top:0; cursor:pointer; width:60px; height:33px; float:right; margin:0 2px;} |
17 | .onlineService{ background:none; display:none; width:39px; *width:84px; height:178px; ;position:fixed; right:0; top:44px; _position:absolute;} |
18 | .onlineService .ico_os{ background-position:-2px -20px; border:1px solid #c7c7c7; cursor:pointer; width:39px; height:98px; float:right;} |
19 | .onlineService .ico_gt{ background-position:right 0; border:1px solid #299ec0; cursor:pointer; width:39px; height:37px; float:right; clear:both;} |
20 | .onlineService .ico_pp{ background-position:right -60px; border:1px solid #81b140; cursor:pointer; width:39px; height:37px; float:right; margin:0 0 1px 0; clear:both;} |
21 | .box_os .osqq p span a{color:#557917;} |
23 | <script src="js/feedback_util.js"></script> |
2、在body区域引入下面的代码：
02 | <div class="os_x"></div> |
04 | <p><em>(工作日：9:30-18:30)</em></p> |
05 | <p><strong>在线QQ</strong></p> |
06 | <p id="ico_onlineqq" class="qq"></p> |
07 | <p><strong>客服电话</strong><span>010-0000000</span><span>010-0000000</span></p> |
08 | <p><strong>会员卡代理</strong><span>010-000000-0000</span></p> |
12 | <a class="ico_pp" onclick="FeedbackUtil.feed('http://www.5imoban.net');" href="javascript:void(0);" title=""></a> |
13 | <a class="ico_gt" href="#" target="_self" title=""></a> |
16 | <div class="onlineService"> |
17 | <p class="ico_os"></p> |
18 | <a class="ico_pp" onclick="FeedbackUtil.feed('http://www.5imoban.net/');" href="javascript:void(0);" title=""></a> |
19 | <a class="ico_gt" href="#" target="_self" title=""></a> |
21 | <script type="text/javascript" src="js/onlineService20130718.js"></script> |
3、更改“onclick="FeedbackUtil.feed('http://www.5imoban.net/');"”里面的网址为您网站留言处理页面地址。
