网页右侧悬浮滚动在线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 相关文章推荐
jQuery toggle()设置CSS样式
Nov 05 Javascript
类似GMAIL的Ajax信息反馈显示
Feb 16 Javascript
在UpdatePanel内jquery easyui效果失效的解决方法
Apr 11 Javascript
关于两个jQuery(js)特效冲突的bug的解决办法
Sep 04 Javascript
通过BootStrap实现轮播图的实际应用
Sep 26 Javascript
javascript事件的绑定基础实例讲解(34)
Feb 14 Javascript
快速掌握jquery分页插件jqPaginator的使用方法
Aug 09 jQuery
vue实现倒计时获取验证码效果
Apr 17 Javascript
Vue的全局过滤器和私有过滤器的实现
Apr 20 Javascript
Vue如何基于vue-i18n实现多国语言兼容
Jul 17 Javascript
jquery实现拖拽添加元素功能
Dec 01 jQuery
vue递归实现树形组件
Jul 15 Vue.js
一个简单的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
php 传值赋值与引用赋值的区别
2010/12/29 PHP
基于php导出到Excel或CSV的详解(附utf8、gbk 编码转换)
2013/06/25 PHP
php读取excel文件示例分享(更新修改excel)
2014/02/27 PHP
php中的登陆login实例代码
2016/06/20 PHP
PHP实现统计在线人数功能示例
2016/10/15 PHP
javascritp实现input输入框相关限制用法
2007/06/29 Javascript
用javascript实现兼容IE7的类库 IE7_0_9.zip提供下载
2007/08/08 Javascript
Javascript解决常见浏览器兼容问题的12种方法
2010/01/04 Javascript
JS+CSS实现大气清新的滑动菜单效果代码
2015/10/22 Javascript
几种经典排序算法的JS实现方法
2016/03/25 Javascript
深入理解jQuery之事件移除
2016/06/02 Javascript
jQuery 获取页面li数组并删除不在数组中的key
2016/08/02 Javascript
Angularjs中ng-repeat-start与ng-repeat-end的用法实例介绍
2016/12/31 Javascript
集合Bootstrap自定义confirm提示效果
2017/09/19 Javascript
BootStrap自定义popover,点击区域隐藏功能的实现
2018/01/23 Javascript
vue服务端渲染操作简单入门实例分析
2019/08/28 Javascript
浅谈webpack和webpack-cli模块源码分析
2020/01/19 Javascript
浅析JavaScript 函数防抖和节流
2020/07/13 Javascript
github配置使用指南
2014/11/18 Python
低版本中Python除法运算小技巧
2015/04/05 Python
python判断字符串编码的简单实现方法(使用chardet)
2016/07/01 Python
python实现Adapter模式实例代码
2018/02/09 Python
浅谈Tensorflow模型的保存与恢复加载
2018/04/26 Python
详解python3中tkinter知识点
2018/06/21 Python
基于Django静态资源部署404的解决方法
2019/07/28 Python
css3 仿写阿里云水纹效果的示例代码
2018/02/10 HTML / CSS
纯CSS3实现移动端展开和收起效果的示例代码
2020/04/26 HTML / CSS
俄罗斯EPL钻石珠宝店:ЭПЛ
2019/10/22 全球购物
教师批评与自我批评(群众路线)
2014/10/15 职场文书
二审答辩状范文
2015/05/22 职场文书
优秀团员主要事迹材料
2015/11/05 职场文书
《红领巾真好》教学反思
2016/02/16 职场文书
MYSQL(电话号码,身份证)数据脱敏的实现
2021/05/28 MySQL
python编程简单几行代码实现视频转换Gif示例
2021/10/05 Python
MySQL窗口函数的具体使用
2021/11/17 MySQL
Redis 报错 error:NOAUTH Authentication required
2022/05/15 Redis