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 相关文章推荐
JavaScript 调试器简介
Feb 21 Javascript
JS 巧妙获取剪贴板数据 Excel数据的粘贴
Jul 09 Javascript
jquery 多行滚动代码(附详细解释)
Jun 17 Javascript
jquery 简单应用示例总结
Aug 09 Javascript
使用js声明数组,对象在jsp页面中(获得ajax得到json数据)
Nov 05 Javascript
JavaScript修改css样式style动态改变元素样式
Dec 16 Javascript
Jquery在指定DIV加载HTML示例代码
Feb 17 Javascript
jQuery实现的鼠标经过时变宽的效果(附demo源码)
Apr 28 Javascript
jquery实现的table排序功能示例
Mar 10 Javascript
Vue中组件之间数据的传递的示例代码
Sep 08 Javascript
vue实现将数据存入vuex中以及从vuex中取出数据
Nov 08 Javascript
详解element上传组件before-remove钩子问题解决
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中文乱码
2009/11/26 PHP
WordPress自定义时间显示格式
2015/03/27 PHP
PHP通过API获取手机号码归属地
2015/05/28 PHP
微信支付开发告警通知实例
2016/07/12 PHP
php+ajax 文件上传代码实例
2019/03/18 PHP
PHP设计模式(七)组合模式Composite实例详解【结构型】
2020/05/02 PHP
JavaScript面向对象知识串结(读JavaScript高级程序设计(第三版))
2012/07/17 Javascript
jQuery实现多按钮单击变色
2014/11/27 Javascript
4种JavaScript实现简单tab选项卡切换的方法
2016/01/06 Javascript
AngularJS中directive指令使用之事件绑定与指令交互用法示例
2016/11/22 Javascript
微信小程序商城项目之侧栏分类效果(1)
2017/04/17 Javascript
JS按钮闪烁功能的实现代码
2017/07/21 Javascript
React Native中的RefreshContorl下拉刷新使用
2017/10/09 Javascript
React-Router如何进行页面权限管理的方法
2017/12/06 Javascript
nodejs require js文件入口,在package.json中指定默认入口main方法
2018/10/10 NodeJs
Vue源码解析之数组变异的实现
2018/12/04 Javascript
小程序server请求微信服务器超时的解决方法
2019/05/21 Javascript
JS在Array数组中按指定位置删除或添加元素对象方法示例
2019/11/19 Javascript
vue项目中使用particles实现粒子背景效果及遇到的坑(按钮没有点击响应)
2020/02/11 Javascript
原生javascript实现类似vue的数据绑定功能示例【观察者模式】
2020/02/24 Javascript
微信小程序实现手指拖动选项排序
2020/04/22 Javascript
浅谈Python 集合(set)类型的操作——并交差
2016/06/30 Python
python中的字典使用分享
2016/07/31 Python
python实现简单俄罗斯方块
2020/03/13 Python
Django ORM filter() 的运用详解
2020/05/14 Python
世界上最大的网络主机公司:1&1
2016/10/12 全球购物
商场消防演习方案
2014/02/12 职场文书
公司新年寄语
2014/04/04 职场文书
需求分析说明书
2014/05/09 职场文书
不忘国耻振兴中华演讲稿
2014/05/14 职场文书
企业诚信承诺书
2014/05/23 职场文书
领导干部“四风”问题批评与自我批评材料
2014/09/24 职场文书
想要创业,那么你做好准备了吗?
2019/07/01 职场文书
Nginx同一个域名配置多个项目的实现方法
2021/03/31 Servers
Vue图片裁剪组件实例代码
2021/07/02 Vue.js
Python实现为PDF去除水印的示例代码
2022/04/03 Python