在线客服html前端代码QQ微信联系

最新推荐文章于 2025-05-09 13:10:32 发布

彭祥.

最新推荐文章于 2025-05-09 13:10:32 发布

阅读量8.8k

点赞数 2

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/pengxiang1998/article/details/91348960

本文提供了一个使用jQuery实现的在线客服系统代码，包括橙色按钮样式、弹出窗口功能以及QQ、电话和微信联系方式。通过jQuery和CSS，实现了客服窗口的开关效果，以及页面底部的返回顶部按钮。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[详细问题可以点击此处联系我](https://pengxiang1998.github.io/jianli/) 在这里插入图片描述

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

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

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

</head>
<body>

<div style="height:2000px;"></div>

<div class="main-im">

	<div id="open_im" class="open-im">&nbsp;</div>  
	
	<div class="im_main" id="im_main">
		<div id="close_im" class="close-im"><a href="javascript:void(0);" title="点击关闭">&nbsp;</a></div>
		<a href="http://wpa.qq.com/msgrd?v=3&uin=3549419718&site=qq&menu=yes" class="im-qq qq-a" title="在线QQ客服">
			<div class="qq-container"></div>
			<div class="qq-hover-c"><img class="img-qq" src="images/qq.png"></div>
			<span> QQ在线咨询</span>
		</a>
		<div class="im-tel">
			<div>售前咨询热线</div>
			<div class="tel-num">400-123-8888</div>
			<div>售后咨询热线</div>
			<div class="tel-num">021-12345678</div>
		</div>
		<div class="im-footer" style="position:relative">
			<div class="weixing-container">
				<div class="weixing-show">
					<div class="weixing-txt">微信扫一扫<br>关注17素材网<br>获取更多免费素材</div>
					<img class="weixing-ma" src="images/weixing-ma.jpg">
					<div class="weixing-sanjiao"></div>
					<div class="weixing-sanjiao-big"></div>
				</div>
			</div>
			<div class="go-top"><a href="javascript:;" title="返回顶部"></a> </div>
			<div style="clear:both"></div>
		</div>
	</div>
	
</div>


</body>
</html>