首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

左右悬浮可分组的网站QQ在线客服代码(可谓经典)

Posted in Javascript onDecember 21, 2012 
<!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> 
<title>左右悬浮可分组的网站QQ在线客服代码</title> 
<meta http-equiv="content-type" content="text/html;charset=gb2312"> 
<style type="text/css"> 
.qqwid{width:142px;background-image:url(/jscss/demoimg/201011/qq_bg.gif);color:#000000;} 
.qqwid a{text-decoration:none;} 
.qqwid a:link{color:#000000;} 
.qqwid a:visited{color:#000000;} 
.qqwid a:hover{color:#FF0000;} 
.qqwid a:active{color:#000000;} 
.qqwid .qqnei{margin-left:5px;margin-right:5px;line-height:25px;} 
.qqwid .qqnei img{margin-left:3px;margin-right:5px;vertical-align:middle;} 
.qqwid td{font-size:12px;height:25px;line-height:25px;} 
</style> 
</head> 
<body> 
<div style="height:2000px;"></div> 
<!--左漂浮--> 
<div id="leftfu" name="leftfu" style="position:absolute;left:1px;top:125px;"> 
<table border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td valign="top"> 
<table width="10" border="0" cellspacing="0" cellpadding="0" id="leftmenu"> 
<tr> 
<td><a href="#" onclick="window.open('http://#','','width=800,height=600,top=0,left=100,status=yes')"> 
<img src="/jscss/demoimg/201011/qq_Asall.jpg" border="0"></a></td> 
</tr> 
<tr> 
<td><a target="_blank" href="http://sighttp.qq.com/authd?IDKEY=534e023a34d2ce9548a6e7e0f92cd59c2bd5c36a2f7f25d6"><img src="/jscss/demoimg/201011/qq_Online.jpg" border="0" ></a></td> 
</tr> 
<tr> 
<td align="right"><a href="javascript:" onclick="javascript:divclose('leftmenu');"><img src="/jscss/demoimg/201011/close.jpg" border="0"></a></td> 
</tr> 
</table> 
</td> 
</tr> 
</table> 
</div> 
<!--左漂浮--> 
<!--右漂浮--> 
<div id="rightfu" name="rightfu" style="position:absolute;right:1px;top:125px;"> 
<table border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td valign="top"> 
<div class="qqwid" id="showrightmenu_1" style="filter:alpha(opacity=80);z-index:1; display:none;" onmouseover="javascript:showrightmenuover(1);" onmouseout="javascript:showrightmenuout(1);"> 
<div><img src="/jscss/demoimg/201011/qq_top.gif"></div> 
<div class="qqnei"> 
<table border="0" cellspacing="0" cellpadding="0" style="filter:alpha(opacity=86);"> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes" target="_blank">在线客服</a></td> 
</tr> 
</table> 
</div> 
<div><img src="/jscss/demoimg/201011/qq_bottom.gif" width="142" height="6"></div> 
</div> 
<div class="qqwid" id="showrightmenu_2" style="filter:alpha(opacity=80);z-index:1;margin-top:87px;display:none;" onmouseover="javascript:showrightmenuover(2);" onmouseout="javascript:showrightmenuout(2);"> 
<div><img src="/jscss/demoimg/201011/qq_top.png"></div> 
<div class="qqnei"> 
<table border="0" cellspacing="0" cellpadding="0" style="filter:alpha(opacity=86);"> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
</table> 
</div> 
<div><img src="/jscss/demoimg/201011/qq_bottom.png" width="142" height="6"></div> 
</div> 
<div class="qqwid" id="showrightmenu_3" style="filter:alpha(opacity=80);z-index:1;margin-top:174px;display:none;" onmouseover="javascript:showrightmenuover(3);" onmouseout="javascript:showrightmenuout(3);"> 
<div><img src="/jscss/demoimg/201011/qq_top.png"></div> 
<div class="qqnei"> 
<table border="0" cellspacing="0" cellpadding="0" style="filter:alpha(opacity=90);"> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
<tr> 
<td><img src="http://wpa.qq.com/pa?p=1:539680:17" height="17" border="0" align="middle"> 
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=539680&site=#&menu=yes">在线客服</a></td> 
</tr> 
</table> 
</div> 
<div><img src="/jscss/demoimg/201011/qq_bottom.png" width="142" height="6"></div> 
</div> 
</td> 
<td valign="top"> 
<table width="10" border="0" cellspacing="0" cellpadding="0" id="rightmenu"> 
<tr> 
<td><a href="javascript:" onmouseover="javascript:showrightmenuover(1);" onmouseout="javascript:showrightmenuout(1);"> 
<img src="/jscss/demoimg/201011/qq_Atuo.jpg" border="0"></a></td> 
</tr> 
<tr> 
<td><a href="javascript:" onmouseover="javascript:showrightmenuover(2);" onmouseout="javascript:showrightmenuout(2);"> 
<img src="/jscss/demoimg/201011/qq_Adns.jpg" border="0" ></a></td> 
</tr> 
<tr> 
<td><a href="javascript:" onmouseover="javascript:showrightmenuover(3);" onmouseout="javascript:showrightmenuout(3);"> 
<img src="/jscss/demoimg/201011/qq_Beian.jpg" border="0"></a></td> 
</tr> 
<tr> 
<td align="left"><a href="javascript:" onclick="javascript:divclose('rightmenu');"> 
<img src="/jscss/demoimg/201011/close.jpg" border="0"></a></td> 
</tr> 
</table> 
</td> 
</tr> 
</table> 
</div> 
<!--右漂浮--> 
<script event="fscommand()" for="eccoolad" type="text/javascript"></script> 
<script type="text/javascript"> 
//leftfu.style.visibility='hidden'; 
//sorollDiv1.style.visibility='hidden'; 
var lastScrollY=0; 
var setup=0.02 
function heartBeat(){ 
diffY=document.documentElement.scrollTop; 
percent=setup*(diffY-lastScrollY); 
if(percent>0)percent=Math.ceil(percent); 
else percent=Math.floor(percent); 
document.getElementById("leftfu").style.top=parseInt(document.getElementById("leftfu").style.top)+percent+"px"; 
document.getElementById("rightfu").style.top=parseInt(document.getElementById("rightfu").style.top)+percent+"px"; 
lastScrollY=lastScrollY+percent; 
} 
window.setInterval("heartBeat()",1); 
function divclose(name){ 
document.getElementById(name).style.visibility='hidden'; 
} 
function showqqdivover(i) 
{ 
document.getElementById("showqq"+i).style.display="block"; 
} 
function showqqdivout(i) 
{ 
document.getElementById("showqq"+i).style.display="none"; 
} 
function showleftmenuover(id) 
{ 
document.getElementById("showleftmenu_"+id).style.display="block"; 
} 
function showleftmenuout(id) 
{ 
document.getElementById("showleftmenu_"+id).style.display="none"; 
} 
function showrightmenuover(id) 
{ 
document.getElementById("showrightmenu_"+id).style.display="block"; 
} 
function showrightmenuout(id) 
{ 
document.getElementById("showrightmenu_"+id).style.display="none"; 
} 
</script> 
</body> 
</html>

左右悬浮可分组的网站QQ在线客服代码(可谓经典)

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
JavaScript中各种编码解码函数的区别和注意事项
Aug 19 Javascript
js中方法重载如何实现？以及函数的参数问题
Aug 01 Javascript
jQuery简单实现QQ空间点赞已经取消点赞
Apr 02 Javascript
jQuery处理图片加载失败的常用方法
Jun 08 Javascript
Bootstrap学习笔记之环境配置(1)
Dec 07 Javascript
jQuery的$.extend 浅拷贝与深拷贝
Mar 08 Javascript
微信小程序实现滑动删除效果
May 19 Javascript
JavaScript基础进阶之数组方法总结(推荐)
Sep 04 Javascript
ES6 javascript中class静态方法、属性与实例属性用法示例
Oct 30 Javascript
微信小程序修改swiper默认指示器样式的实例代码
Jul 18 Javascript
使用vue-router切换页面时，获取上一页url以及当前页面url的方法
May 06 Javascript
vue添加锚点,实现滚动页面时锚点添加相应的class操作
Aug 10 Javascript
JS弹出窗口代码大全(详细整理)
Dec 21 #Javascript
mailto的使用技巧分享
Dec 21 #Javascript
一个页面放2段图片滚动代码出现冲突的问题如何解决
Dec 21 #Javascript
TextArea设置MaxLength属性最大输入值的js代码
Dec 21 #Javascript
JQuery实现简单时尚快捷的气泡提示插件
Dec 20 #Javascript
JQuery实现简单验证码提示解决方案
Dec 20 #Javascript
javascript的原生方法获取数组中的最大(最小)值
Dec 19 #Javascript
SSH(3) 双人对弈(1) 人人对战(1) 后端(1) 算法(1) Vscode(3) OVERLORD(1) 2022年7月新番(1) 数据表(1) 时钟(1)
You might like
PHP sprintf() 函数的应用(定义和用法)
2012/06/29 PHP
php输出xml格式字符串(用的这个)
2012/07/12 PHP
PHP7.0安装笔记整理
2015/08/28 PHP
ThinkPHP2.x防范XSS跨站攻击的方法
2015/09/25 PHP
php 中的closure用法详解
2017/06/12 PHP
php判断/计算闰年的方法小结【三种方法】
2019/07/06 PHP
jquery UI 1.72 之datepicker
2009/12/29 Javascript
HTML Dom与Css控制方法
2010/10/25 Javascript
详解javascript遍历方式
2015/11/11 Javascript
jQuery旋转木马式幻灯片轮播特效
2015/12/04 Javascript
Bootstrap中的表单验证插件bootstrapValidator使用方法整理（推荐）
2016/06/21 Javascript
JavaScript实现Fly Bird小游戏
2016/12/15 Javascript
AngularJS中的按需加载ocLazyLoad示例
2017/01/11 Javascript
JS 学习总结之正则表达式的懒惰性和贪婪性
2017/07/03 Javascript
Vue中this.$router.push参数获取方法
2018/02/27 Javascript
讲解vue-router之什么是编程式路由
2018/05/28 Javascript
js 实现ajax发送步骤过程详解
2019/07/25 Javascript
jQuery实现input[type=file]多图预览上传删除等功能
2019/08/02 jQuery
js实现橱窗展示效果
2020/01/11 Javascript
vue基于better-scroll实现左右联动滑动页面
2020/06/30 Javascript
[52:08]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第一局
2016/03/05 DOTA
老生常谈python函数参数的区别(必看篇)
2017/05/29 Python
python基础教程项目五之虚拟茶话会
2018/04/02 Python
python3写的简单本地文件上传服务器实例
2018/06/04 Python
Python+pandas计算数据相关系数的实例
2018/07/03 Python
浅谈python在提示符下使用open打开文件失败的原因及解决方法
2018/11/30 Python
在Pycharm中设置默认自动换行的方法
2019/01/16 Python
Python学习笔记之视频人脸检测识别实例教程
2019/03/06 Python
Python+Opencv实现把图片、视频互转的示例
2020/12/17 Python
Python3+Flask安装使用教程详解
2021/02/16 Python
SmartBuyGlasses中国：唯视良品（销售名牌太阳镜、墨镜和眼镜框）
2017/07/03 全球购物
Antler英国官网：购买安特丽行李箱、拉杆箱
2019/08/25 全球购物
消防安全责任书范本
2014/04/15 职场文书
竞选学习委员演讲稿
2014/04/28 职场文书
圣贤教育改变命运观后感
2015/06/16 职场文书
python获取淘宝服务器时间的代码示例
2021/04/22 Python