js 左右悬浮对联广告代码示例


Posted in Javascript onDecember 12, 2014

一段js 左右悬浮广告代码,只要修改广告图片地址与连接地址,相应参数根据页面调整下就可以使用这段左右悬浮广告代码了

代码:

var delta=0.15
 var collection;
 function floaters() {
 this.items = ;
 this.addItem = function(id,x,y,content)
   {
   document.write('<DIV id='+id+' style="Z-INDEX: 10; POSITION: absolute; width:80px; height:60px;left:'+(typeof(x)=='string'?eval(x):x)+';top:'+(typeof(y)=='string'?eval(y):y)+'">'+content+'</DIV>');
   
   var newItem  = {};
   newItem.object  = document.getElementById(id);
   newItem.x  = x;
   newItem.y  = y;
   this.items[this.items.length] = newItem;
   }
 this.play = function()
   {
   collection  = this.items
   setInterval('play()',10);
   }
 }
 function play()
 {
  for(var i=0;i<collection.length;i++)
  {
  var followObj = collection[i].object;
  var followObj_x = (typeof(collection[i].x)=='string'?eval(collection[i].x):collection[i].x);
  var followObj_y = (typeof(collection[i].y)=='string'?eval(collection[i].y):collection[i].y);
  if(followObj.offsetLeft!=(document.body.scrollLeft+followObj_x)) {
   var dx=(document.body.scrollLeft+followObj_x-followObj.offsetLeft)*delta;
   dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx));
   followObj.style.left=followObj.offsetLeft+dx;
   }
  if(followObj.offsetTop!=(document.body.scrollTop+followObj_y)) {
   var dy=(document.body.scrollTop+followObj_y-followObj.offsetTop)*delta;
   dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy));
   followObj.style.top=followObj.offsetTop+dy;
   }
  followObj.style.display = '';
  }
 } 
 
 var theFloaters = new floaters();
 theFloaters.addItem('followDiv1','document.body.clientWidth-112',230,'<a href=左链接地址 target=_blank><img src=左图片地址 border=0></a>');
 theFloaters.addItem('followDiv2',12,230,'<a href=右链接地址 target=_blank><img src=右图片地址 border=0></a>');
 theFloaters.play();

另存为*.js文件,在页面中引用:<script src="*.js"></script>调用即可,*代表你另存的文件名!
注意:修改广告图片地址和连接地址!相应的参数可以根据页面自行调整。

Javascript 相关文章推荐
这段js代码得节约你多少时间
Dec 20 Javascript
javascript返回顶部效果(自写代码)
Jan 06 Javascript
javascript中自定义对象的属性方法分享
Jul 12 Javascript
网页广告中JS代码的信息监听示例
Apr 02 Javascript
jQuery实现图片与文字描述左右滑动自动切换的方法
Jul 27 Javascript
jQuery实现简单的tab标签页效果
Sep 12 Javascript
JavaScript基于自定义函数判断变量类型的实现方法
Nov 23 Javascript
深入理解javascript函数参数与闭包
Dec 12 Javascript
bootstrap datetimepicker日期插件使用方法
Jan 13 Javascript
vue列表单项展开收缩功能之this.$refs的详解
May 05 Javascript
微信小程序设置滚动条过程详解
Jul 25 Javascript
JS async 函数的含义和用法实例总结
Apr 08 Javascript
原生JavaScript+LESS实现瀑布流
Dec 12 #Javascript
jquery禁止回车触发表单提交
Dec 12 #Javascript
完美兼容各大浏览器的jQuery插件实现图片切换特效
Dec 12 #Javascript
windows8.1+iis8.5下安装node.js开发环境
Dec 12 #Javascript
jQuery 和 CSS 的文本特效插件集锦
Dec 12 #Javascript
js使用递归解析xml
Dec 12 #Javascript
做web开发 先学JavaScript
Dec 12 #Javascript
You might like
PHP删除HTMl标签的三种解决方法
2013/06/30 PHP
PHP Hash算法:Times33算法代码实例
2015/05/13 PHP
大家须知简单的php性能优化注意点
2016/01/04 PHP
PHP中使用jQuery+Ajax实现分页查询多功能操作(示例讲解)
2017/09/17 PHP
Mootools 1.2教程 设置和获取样式表属性
2009/09/15 Javascript
jQuery 1.5 源码解读 面向中高阶JSER
2011/04/05 Javascript
JS实现点击按钮自动增加一个单元格的方法
2015/03/09 Javascript
jQuery常用且重要方法汇总
2015/07/13 Javascript
JS判断元素是否在数组内的实现代码
2016/03/30 Javascript
深入浅出ES6之let和const命令
2016/08/25 Javascript
jQuery中的insertBefore(),insertAfter(),after(),before()区别介绍
2016/09/01 Javascript
微信小程序url与token设置详解
2017/09/26 Javascript
vue+iview+less 实现换肤功能
2018/08/17 Javascript
vue 点击按钮增加一行的方法
2018/09/07 Javascript
如何为你的JavaScript代码日志着色详解
2019/04/08 Javascript
JS document对象简单用法完整示例
2020/01/14 Javascript
如何手动实现一个 JavaScript 模块执行器
2020/10/16 Javascript
[04:03]辉夜杯主赛事 12月25日RECAP精彩回顾
2015/12/26 DOTA
[55:48]VGJ.S vs TNC Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
以windows service方式运行Python程序的方法
2015/06/03 Python
在Python的Django框架中创建和使用模版
2015/07/15 Python
在Python的Django框架中创建语言文件
2015/07/27 Python
Python实现并行抓取整站40万条房价数据(可更换抓取城市)
2016/12/14 Python
python ftp 按目录结构上传下载的实现代码
2018/09/12 Python
Python 从列表中取值和取索引的方法
2018/12/25 Python
详解pandas映射与数据转换
2021/01/22 Python
使用canvas来完成线性渐变和径向渐变的功能的方法示例
2019/07/25 HTML / CSS
工商治理实习生的自我评价分享
2014/02/20 职场文书
甜品店创业计划书
2014/08/14 职场文书
2014县政府领导班子对照检查材料思想汇报
2014/09/25 职场文书
大学生助学金感谢信
2015/01/21 职场文书
团员年度个人总结
2015/02/26 职场文书
教研活动主持词
2015/07/03 职场文书
python基于tkinter制作m3u8视频下载工具
2021/04/24 Python
解决numpy和torch数据类型转化的问题
2021/05/23 Python
python 进阶学习之python装饰器小结
2021/09/04 Python