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


Posted in Javascript onApril 28, 2014

网页右侧悬浮滚动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<all.length; 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<num.length; i++){
   obj[i].innerHTML = "<a target='_blank' href='http://wpa.qq.com/msgrd?v=3&uin="+num[i]+"&site=qq&menu=yes'><img border='0' src='http://wpa.qq.com/pa?p=2:"+num[i]+":51' alt='点击咨询' title='点击咨询'/></a>";
  };
 };
};
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);
 };
};
Javascript 相关文章推荐
Add a Table to a Word Document
Jun 15 Javascript
jquery 表格的增行删行实现思路
Mar 21 Javascript
jQuery动态添加删除select项(实现代码)
Sep 03 Javascript
页面元素绑定jquery toggle后元素隐藏的解决方法
Mar 27 Javascript
JS动态添加iframe的代码
Sep 14 Javascript
JS实现侧边栏鼠标经过弹出框+缓冲效果
Mar 29 Javascript
JS+canvas绘制的动态机械表动画效果
Sep 12 Javascript
基于AngularJs select绑定数字类型的问题
Oct 08 Javascript
vue微信分享出来的链接点开是首页问题的解决方法
Nov 28 Javascript
说说如何使用Vuex进行状态管理(小结)
Apr 14 Javascript
webpack结合express实现自动刷新的方法
May 07 Javascript
vue各种事件监听实例(小结)
Jun 24 Javascript
一个简单的jquery进度条示例
Apr 28 #Javascript
javascript处理表单示例(javascript提交表单)
Apr 28 #Javascript
js对象内部访问this修饰的成员函数示例
Apr 27 #Javascript
node.js中的socket.io入门实例
Apr 26 #Javascript
jquery鼠标放上去显示悬浮层即弹出定位的div层
Apr 25 #Javascript
js控制容器隐藏出现防止样式变化的两种方法
Apr 25 #Javascript
Jquery 点击按钮自动高亮实现原理及代码
Apr 25 #Javascript
You might like
用文本文件实现的动态实时发布新闻的程序
2006/10/09 PHP
php 搜索框提示(自动完成)实例代码
2012/02/05 PHP
ThinkPHP实现更新数据实例详解(demo)
2016/06/29 PHP
Laravel框架FormRequest中重写错误处理的方法
2019/02/18 PHP
JScript内置对象Array中元素的删除方法
2007/03/08 Javascript
IE8 兼容性问题(属性名区分大小写)
2009/06/04 Javascript
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
2010/08/13 Javascript
js Map List 遍历使用示例
2013/07/10 Javascript
Jquery 动态生成表格示例代码
2013/12/24 Javascript
JavaScript中的数值范围介绍
2014/12/29 Javascript
jquery文档操作wrap()方法实例简述
2015/01/10 Javascript
jQuery与getJson结合的用法实例
2015/08/07 Javascript
jQuery实现单击弹出Div层窗口效果(可关闭可拖动)
2015/09/19 Javascript
vue.js入门(3)——详解组件通信
2016/12/02 Javascript
javascript笔记之匿名函数和闭包
2017/02/06 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
2017/12/07 Javascript
详解VueJS应用中管理用户权限
2018/02/02 Javascript
详解Vue+axios+Node+express实现文件上传(用户头像上传)
2018/08/10 Javascript
[01:02]2014 DOTA2国际邀请赛中国区预选赛 现场抢先看
2014/05/22 DOTA
详解Python之unittest单元测试代码
2018/01/24 Python
Python批量提取PDF文件中文本的脚本
2018/03/14 Python
Appium+python自动化之连接模拟器并启动淘宝APP(超详解)
2019/06/17 Python
python logging模块的使用总结
2019/07/09 Python
Pytorch 解决自定义子Module .cuda() tensor失败的问题
2020/06/23 Python
Python日志器使用方法及原理解析
2020/09/27 Python
英国旅游额外服务市场领导者:Holiday Extras(机场停车场、酒店、接送等)
2017/10/07 全球购物
Can a struct inherit from another class? (结构体能继承类吗)
2014/07/22 面试题
如何用Java判断一个文件或目录是否存在
2012/11/19 面试题
大学毕业的自我鉴定
2013/10/08 职场文书
公务员的自我鉴定
2013/10/26 职场文书
网络公司美工设计工作个人的自我评价
2013/11/03 职场文书
英语道歉信范文
2014/01/09 职场文书
校园之声广播稿
2014/01/31 职场文书
2014年居委会工作总结
2014/12/09 职场文书
Nginx反向代理及负载均衡如何实现(基于linux)
2021/03/31 Servers
CSS使用伪类控制边框长度的方法
2022/01/18 HTML / CSS