特效描述:jQuery实现 隐藏收缩 在线客服特效,jQuery实现隐藏收缩在线客服特效
代码部署教程
1. 引入CSS
<link href=”css/style.css” rel=”stylesheet” type=”text/css”>
2. 引入JS
<script type=”text/javascript” src=”js/jquery-1.4.2.min.js”></script>
<script type=”text/javascript” src=”js/kefu.js”></script>
3. HTML代码
<!–在线客服Begin–>
<div id=”floatTools” class=”rides-cs”>
<div class=”floatL”>
<a style=”display: block” id=”aFloatTools_Show” class=”btnOpen” title=”查看在线客服” onClick=”javascript:$(‘#divFloatToolsView’).animate({width: ‘show’, opacity: ‘show’}, ‘normal’,function(){ $(‘#divFloatToolsView’).show();kf_setCookie(‘RightFloatShown’, 0, ”, ‘/’, ‘www.shopnc.net’); });$(‘#aFloatTools_Show’).attr(‘style’,’display:none’);$(‘#aFloatTools_Hide’).attr(‘style’,’display:block’);” href=”javascript:void(0);”>
展开</a>
<a style=”display: none” id=”aFloatTools_Hide” class=”btnCtn” title=”关闭在线客服” onClick=”javascript:$(‘#divFloatToolsView’).animate({width: ‘hide’, opacity: ‘hide’}, ‘normal’,function(){ $(‘#divFloatToolsView’).hide();kf_setCookie(‘RightFloatShown’, 1, ”, ‘/’, ‘www.shopnc.net’); });$(‘#aFloatTools_Show’).attr(‘style’,’display:block’);$(‘#aFloatTools_Hide’).attr(‘style’,’display:none’);” href=”javascript:void(0);”>
收缩</a> </div>
<div id=”divFloatToolsView” class=”floatR” style=”display: none”>
<div class=”cn”>
<h3 class=”titZx”>产品销售</h3>
<ul>
<li><span>客服1</span>
<a target=”_blank” href=”http://www.cxvn.com/msgrd?v=3&uin=123456&site=qq&menu=yes”>
<img border=”0″ src=”http://www.cxvn.com/pa?p=2:123456:51″ alt=”ShopNC客服1″ title=”ShopNC客服1″ /></a>
</li>
</li>
<li><span>客服2</span>
<a target=”_blank” href=”http://www.cxvn.com/msgrd?v=3&uin=123456&site=qq&menu=yes”>
<img border=”0″ src=”http://www.cxvn.com/pa?p=2:123456:51″ alt=”ShopNC客服2″ title=”ShopNC客服2″ /></a></li>
</ul>
<h3>大宗订制</h3>
<ul>
<li><span>订 制</span>
<a target=”_blank” href=”http://www.cxvn.com/msgrd?v=3&uin=123456&site=qq&menu=yes”>
<img border=”0″ src=”http://www.cxvn.com/pa?p=2:123456:51″ alt=”大宗订制服务” title=”大宗订制服务” /></a></li>
</ul>
<h3>售后服务</h3>
<ul>
<li><span>售 后</span>
<a target=”_blank” href=”http://www.cxvn.com/msgrd?v=3&uin=123456&site=qq&menu=yes”>
<img border=”0″ src=”http://www.cxvn.com/pa?p=2:123456:51″ alt=”售后服务客服” title=”售后服务客服” /></a></li>
</ul>
</div>
</div>
</div>
<!–在线客服End–>
<div style=”text-align:center;clear:both”>
</div>
下载地址
1.《网页在线客服代码 隐藏收缩在线客服代码》援引自互联网,旨在传递更多网络信息知识,仅代表作者本人观点,与本网站无关,侵删请联系页脚下方联系方式。
2.《网页在线客服代码 隐藏收缩在线客服代码》仅供读者参考,本网站未对该内容进行证实,对其原创性、真实性、完整性、及时性不作任何保证。
3.文章转载时请保留本站内容来源地址,https://www.cxvn.com/code/kf/681.html