点击展开收缩qq客服代码

看吧 2019-11-22 167 阅读

特效描述:jQuery侧边栏菜单 点击展开收缩 在线QQ客服代码,jQuery侧边栏,点击展开收缩qq客服代码

代码部署教程

1. 引入CSS

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

2. 引入JS

<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>

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

3. HTML代码

<div class="qq-client">
<a href="javascript:void(0);" class="qq-client-open">点<br/>击<br/>展<br/>开</a>
</div>
<div class="qq-client-content">
<h1>在线客户<span class="qq-client-close">关闭</span></h1>
<div class="qq-client-list">
<div class="client-list"><a href="#1"><label>小明:</label><span>点击联系</span></a> </div>
<div class="client-list"><a href="#2"><label>小明:</label><span>点击联系</span></a> </div>
<div class="client-list"><a href="#3"><label>小明:</label><span>点击联系</span></a> </div>
<div class="client-list"><a href="#4"><label>小明:</label><span>点击联系</span></a> </div>
<div class="client-list" style="border-bottom: none"><a href="#5"><label>小明:</label><span>点击联系</span></a> </div>
</div>
</div>
<div style="height:1000px;"></div>

演示地址下载地址

最新游戏