代码:

<!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>QQ客服悬浮特效代码_www.jb51.net</title>
</head>
<body style="height:2000px;">
<script type="text/javascript">
window.onload = window.onresize = window.onscroll = function ()
{
 var oBox = document.getElementById("qqbox_zzjs");
 var oLine = document.getElementById("online_lanrenzhijia");
 var oMenu = document.getElementById("menu_zzjs_net");
 var iScrollTop = document.documentElement.scrollTop || document.body.scrollTop;
 setTimeout(function ()
 {
 clearInterval(oBox.timer);
 var iTop = parseInt((document.documentElement.clientHeight - oBox.offsetHeight)/2)   iScrollTop;
 oBox.timer = setInterval(function ()
 {
  var iSpeed = (iTop - oBox.offsetTop) / 8;
  iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
  oBox.offsetTop == iTop ? clearInterval(oBox.timer) : (oBox.style.top = oBox.offsetTop   iSpeed   "px");
 }, 30)
 }, 100)
 oBox.onmouseover = function ()
 {
 this.style.width = 131   "px";
 oLine.style.display = "block";
 oMenu.style.display = "none";
 };
 oBox.onmouseout = function ()
 {
 this.style.width = '';
 oLine.style.display = "none";
 oMenu.style.display = "block";
 };
};
document.write("<style>img{border:0;}ul,li{padding:0;margin:0;}.box_lanrenzhijia {z-index:99;right:0;width:128px;height:195px;position:absolute;}.box_lanrenzhijia .press{right:0;width:36px;cursor:pointer;position:absolute;height:128px;}.box_lanrenzhijia .zzjs_net_list{left:0;width:131px;position:absolute;height:195px;background:url(images/20120321lanrenzhijia_1.gif) no-repeat left center;}.box_lanrenzhijia .zzjs_net_list ul{padding:37px 0 0 21px;}.box_lanrenzhijia .zzjs_net_list li{height:26px;margin-bottom:3px;_margin-bottom:3px; list-style-type:none;}</style><div class=\"box_lanrenzhijia\" id=\"qqbox_zzjs\"><div class=\"zzjs_net_list\" id=\"online_lanrenzhijia\" style=\"display:none;\"><ul><li><a href=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=Devmax&Menu=yes\"><img src=\"images/20111126lanrenzhijia_3.gif\" alt=\"Devmax一号客服\"></a></li><li><a href=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=Devmax&Menu=yes\"><img src=\"images/20111126lanrenzhijia_3.gif\" alt=\"Devmax二号客服\"></a></li><li><a href=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=Devmax&Menu=yes\"><img src=\"images/20111126lanrenzhijia_3.gif\" alt=\"Devmax三号客服\"></a></li><li><a href=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=Devmax&Menu=yes\"><img src=\"images/20111126lanrenzhijia_3.gif\" alt=\"Devmax四号客服\"></a></li><li><a href=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=Devmax&Menu=yes\"><img src=\"images/20111126lanrenzhijia_3.gif\" alt=\"Devmax五号客服\"></a></li></ul></div><div id=\"menu_zzjs_net\"><img src=\"images/20111126lanrenzhijia_4.gif\" class=\"press\" alt=\"在线客服\"></div></div>");
</script>
</body>
</html>

js QQ客服悬浮效果实现代码的更多相关文章

  1. jquery实现移动端悬浮拖拽框

    这篇文章主要为大家详细介绍了jquery实现移动端悬浮拖拽框,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  2. iOS实现全局悬浮按钮

    这篇文章主要为大家详细介绍了iOS实现全局悬浮按钮,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  3. JavaScript实现鼠标悬浮页面切换效果

    这篇文章主要为大家详细介绍了JavaScript实现鼠标悬浮页面切换效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  4. vue悬浮表单复合组件开发详解

    这篇文章主要为大家详细介绍了vue悬浮表单复合组件开发,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. javascript实现悬浮跟随框缓动效果

    这篇文章主要为大家详细介绍了javascript实现悬浮跟随框缓动效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  6. Android自定义RecyclerView Item头部悬浮吸顶

    这篇文章主要为大家详细介绍了Android自定义RecyclerView Item头部悬浮吸顶,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  7. js QQ客服悬浮效果实现代码

    一段js实现的QQ客服悬浮特效代码,经常用在网页上显示QQ客服在线信息,很实用的一段代码

  8. jQuery实现移动端悬浮拖动效果

    这篇文章主要为大家详细介绍了jQuery实现移动端悬浮拖动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  9. vue实现滚动条始终悬浮在页面最下方

    这篇文章主要为大家详细介绍了vue实现滚动条始终悬浮在页面最下方,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. 如何使用CSS3+JQuery实现悬浮墙式菜单

    这篇文章主要介绍了如何使用CSS3+JQuery实现悬浮墙式菜单,由于现在很流行的基础触摸的web站点可以运行在移动设备上,我认为我们可以让那些基于桌面浏览器的人们使用站点更加简单。,需要的朋友可以参考下

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部