特效描述：jquery鼠标滑过 网页右侧固定层 qq漂浮窗在线客服，qq漂浮窗口 兼容性比较好 一般主流浏览器都兼容

代码部署教程

1. 引入CSS

<link rel=”stylesheet” href=”css/style.css” />

2. 引入JS

<script type=”text/javascript” src=”js/jquery.min.js”>
</script>

3. HTML代码

<!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″ />

<title>

右侧悬浮jquery在线客服</title>

</head>

<body style=”height:2000px;”>

<div id=”cus_ser”>

<div class=”cus_ser_”>

<div class=”title”>

</div>

<ul>

<li id=”zqq”>

<a href=”http://wp.qq.com/wpa/qunwpa?idkey=6fcb83942dc3630777ae7745bd5093a1a5917f915f4e95cfc498633379ebfbb4″ target=”_blank”>

123456</a>

</li>

<li id=”zphone”>

000000000</li>

<li id=”wb”>

<a href=”http://www.cxvn.com/” target=”_blank”>

腾讯微博</a>

&nbsp;&nbsp;<a href=”http://www.cxvn.com/” target=”_blank”>

新浪微博</a>

</li>

</ul>

</div>

<span class=”close”>

<img src=”images/icon_close.png” />

</span>

</div>

<script type=”text/javascript”>

$(“#cus_ser .close”).click(function(){
$(“#cus_ser”).css({
display: ‘none’
});
});
$(“#cus_ser”).mouseover(function(){
$(this).stop();
$(this).animate({width: 165},400,’swing’);
});
$(“#cus_ser”).mouseout(function(){
$(“#cus_ser”).stop();
$(“#cus_ser”).animate({width:32},400, ‘swing’);
});
</script>

</body>

</html>

下载地址

立即下载

1.《在线qq客服代码生成, jquery qq漂浮窗在线客服代码》援引自互联网，旨在传递更多网络信息知识，仅代表作者本人观点，与本网站无关，侵删请联系页脚下方联系方式。

2.《在线qq客服代码生成, jquery qq漂浮窗在线客服代码》仅供读者参考，本网站未对该内容进行证实，对其原创性、真实性、完整性、及时性不作任何保证。

3.文章转载时请保留本站内容来源地址，https://www.cxvn.com/code/kf/839.html