热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

网页右侧悬浮滚动在线qq客服代码示例

这篇文章主要介绍了网页右侧悬浮滚动qq在线客服代码示例,需要的朋友可以参考下

网页右侧悬浮滚动QQ在线客服代码

代码如下:

function myEvent(obj,ev,fn){
 if (obj.attachEvent){
  obj.attachEvent('on'+ev,fn);
 }else{
  obj.addEventListener(ev,fn,false);
 };
};
function getbyClass(id,sClass){
 var oParent = document.getElementById(id);
 var all = oParent.getElementsByTagName('*');
 var array = [];
 for (var i=0; i  if (all[i].className == sClass){
   array.push(all[i]);
  };
 };
 return array;
};
function getStyle(obj,name){
 if(obj.currentStyle){
  return obj.currentStyle[name];
 }else{
  return getComputedStyle(obj,false)[name];
 };
};
function Running(obj,json,fnEnd){
 clearInterval(obj.timer);
 obj.timer=setInterval(function(){
  var now=0;
  var bStop=true;
  for (var attr in json){
   if(attr=='opacity'){
    now=Math.round(parseFloat(getStyle(obj,attr))*100);
   }else{
    now=parseInt(getStyle(obj,attr));
   };
   var speed=(json[attr]-now)/5;
   speed=speed>0?Math.ceil(speed):Math.floor(speed);
   if(now!=json[attr])bStop=false;
   if(attr=='opacity'){
    obj.style.filter='alpha(opacity:'+now+speed+')';
    obj.style.opacity=(now+speed)/100;
   }else{
    obj.style[attr]=speed+now+'px';
   };
  }
  if(bStop){
   clearInterval(obj.timer);
   if(fnEnd)fnEnd();
  }
 }, 30);
}
function Flexing(obj,json,fnEnd){
 clearInterval(obj.timer);
 obj.timer=setInterval(function(){
  var now=0;
  var bStop=true;
  for (var attr in json){
   if(!obj.speed)obj.speed={};
   if(!obj.speed[attr])obj.speed[attr]=0;
   now=parseInt(getStyle(obj,attr));
   if(Math.abs(json[attr]-now)>1 || Math.abs(obj.speed[attr])>1){
    bStop=false;
    obj.speed[attr]+=(json[attr]-now)/5;
    obj.speed[attr]*=0.85;
    var MaxSpeed=65;
    if(Math.abs(obj.speed[attr])>MaxSpeed){
     obj.speed[attr]=obj.speed[attr]>0?MaxSpeed:-MaxSpeed;
    };
    obj.style[attr]=now+obj.speed[attr]+'px';
   };
  };
  if(bStop){
   clearInterval(obj.timer);
   obj.style[attr]=json[attr]+'px';
   if(fnEnd)fnEnd();
  };
 }, 30);
}
function setqq(obj,num){
 if (obj.length!=num.length){
  alert('\nspan的个数与QQ号码的个数不符,请设置5个QQ号码!\n\n[设置未成功!]');
  return;
 }else{
  for (var i=0; i   obj[i].innerHTML = "点击咨询";
  };
 };
};
function settop(id,id2,top){
 var obj = document.getElementById(id);
 var box = document.getElementById(id2);
 obj.style.top = box.style.top = top+'px';
};
function dealy(id,time){
 var obj = document.getElementById(id);
 var timer = setTimeout(function(){
  Flexing(obj,{right:-100});
 },time*1000);
};
function click_fn(id,id2){
 var obj = document.getElementById(id);
 var box = document.getElementById(id2);
 obj.Onclick= function(){
  Running(obj,{right:-200},function(){
   box.style.display = 'block';
   Running(box,{right:10, opacity:100});     
  });
 };
 box.Onclick= function(){
  timer = setTimeout(function(){
   Running(box,{right:-220,opacity:0},function(){
    box.style.display = 'none';
    Flexing(obj,{right:-100});
   });   
  },3000);
 };
};


推荐阅读
  • 探讨如何高效使用FastJSON进行JSON数据解析,特别是从复杂嵌套结构中提取特定字段值的方法。 ... [详细]
  • 使用 Azure Service Principal 和 Microsoft Graph API 获取 AAD 用户列表
    本文介绍了一段通用代码示例,该代码不仅能够操作 Azure Active Directory (AAD),还可以通过 Azure Service Principal 的授权访问和管理 Azure 订阅资源。Azure 的架构可以分为两个层级:AAD 和 Subscription。 ... [详细]
  • 前言--页数多了以后需要指定到某一页(只做了功能,样式没有细调)html ... [详细]
  • 本文介绍如何使用阿里云的fastjson库解析包含时间戳、IP地址和参数等信息的JSON格式文本,并进行数据处理和保存。 ... [详细]
  • 本文详细介绍了Git分布式版本控制系统中远程仓库的概念和操作方法。通过具体案例,帮助读者更好地理解和掌握如何高效管理代码库。 ... [详细]
  • QBlog开源博客系统:Page_Load生命周期与参数传递优化(第四部分)
    本教程将深入探讨QBlog开源博客系统的Page_Load生命周期,并介绍一种简洁的参数传递重构方法。通过视频演示和详细讲解,帮助开发者更好地理解和应用这些技术。 ... [详细]
  • 深入理解 Oracle 存储函数:计算员工年收入
    本文介绍如何使用 Oracle 存储函数查询特定员工的年收入。我们将详细解释存储函数的创建过程,并提供完整的代码示例。 ... [详细]
  • PyCharm下载与安装指南
    本文详细介绍如何从官方渠道下载并安装PyCharm集成开发环境(IDE),涵盖Windows、macOS和Linux系统,同时提供详细的安装步骤及配置建议。 ... [详细]
  • 在 Windows 10 中,F1 至 F12 键默认设置为快捷功能键。本文将介绍几种有效方法来禁用这些快捷键,并恢复其标准功能键的作用。请注意,部分笔记本电脑的快捷键可能无法完全关闭。 ... [详细]
  • 本文总结了2018年的关键成就,包括职业变动、购车、考取驾照等重要事件,并分享了读书、工作、家庭和朋友方面的感悟。同时,展望2019年,制定了健康、软实力提升和技术学习的具体目标。 ... [详细]
  • 在计算机技术的学习道路上,51CTO学院以其专业性和专注度给我留下了深刻印象。从2012年接触计算机到2014年开始系统学习网络技术和安全领域,51CTO学院始终是我信赖的学习平台。 ... [详细]
  • 本周信息安全小组主要进行了CTF竞赛相关技能的学习,包括HTML和CSS的基础知识、逆向工程的初步探索以及整数溢出漏洞的学习。此外,还掌握了Linux命令行操作及互联网工作原理的基本概念。 ... [详细]
  • 技术分享:从动态网站提取站点密钥的解决方案
    本文探讨了如何从动态网站中提取站点密钥,特别是针对验证码(reCAPTCHA)的处理方法。通过结合Selenium和requests库,提供了详细的代码示例和优化建议。 ... [详细]
  • CSS 布局:液态三栏混合宽度布局
    本文介绍了如何使用 CSS 实现液态的三栏布局,其中各栏具有不同的宽度设置。通过调整容器和内容区域的属性,可以实现灵活且响应式的网页设计。 ... [详细]
  • 本文详细介绍了如何使用 Yii2 的 GridView 组件在列表页面实现数据的直接编辑功能。通过具体的代码示例和步骤,帮助开发者快速掌握这一实用技巧。 ... [详细]
author-avatar
sdfdsafgafsdf
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有