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 全角转半角部分
Oct 28 Javascript
jquery获取input表单值的代码
Apr 19 Javascript
深入Javascript函数、递归与闭包(执行环境、变量对象与作用域链)使用详解
May 08 Javascript
javascript实现点击按钮让DIV层弹性移动的方法
Feb 24 Javascript
JavaScript创建对象的方式小结(4种方式)
Dec 17 Javascript
javascript特殊文本输入框网页特效
Sep 13 Javascript
js前端实现图片懒加载(lazyload)的两种方式
Apr 24 Javascript
详解vue-router和vue-cli以及组件之间的传值
Jul 04 Javascript
Bootstrap Table实现定时刷新数据的方法
Aug 13 Javascript
微信小程序自定义toast组件的方法详解【含动画】
May 11 Javascript
JS为什么说async/await是generator的语法糖详解
Jul 11 Javascript
修改Vue打包后的默认文件名操作
Aug 12 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
Session 失效的原因汇总及解决丢失办法
2015/09/30 PHP
Yii框架核心组件类实例详解
2019/08/06 PHP
laravel实现于语言包的完美切换方法
2019/09/29 PHP
php实现推荐功能的简单实例
2019/09/29 PHP
Web层改进II-用xmlhttp 无声息提交复杂表单
2007/01/22 Javascript
网上抓的一个特效
2007/05/11 Javascript
JS获取页面窗口大小的代码解读
2011/12/01 Javascript
javascript 自定义回调函数示例代码
2014/09/26 Javascript
node.js超时timeout详解
2014/11/26 Javascript
jQuery+HTML5实现手机摇一摇换衣特效
2015/06/05 Javascript
jquery实现select选择框内容左右移动代码分享
2015/11/21 Javascript
Jquery使用小技巧汇总
2015/12/29 Javascript
图片旋转、鼠标滚轮缩放、镜像、切换图片js代码
2020/12/13 Javascript
jquery 无限极下拉菜单的简单实例(精简浓缩版)
2016/05/31 Javascript
JS作为值的函数用法示例
2016/06/20 Javascript
jQuery实现点击任意位置弹出层外关闭弹出层效果
2016/10/19 Javascript
Vue2学习笔记之请求数据交互vue-resource
2017/02/23 Javascript
JS实现搜索关键词的智能提示功能
2017/07/07 Javascript
微信小程序 POST请求的实例详解
2017/09/29 Javascript
vuejs使用递归组件实现树形目录的方法
2017/09/30 Javascript
新版vue-cli模板下本地开发环境使用node服务器跨域的方法
2018/04/03 Javascript
使用PyCharm配合部署Python的Django框架的配置纪实
2015/11/19 Python
Python注释详解
2016/06/01 Python
Python 爬虫模拟登陆知乎
2016/09/23 Python
Python+Socket实现基于TCP协议的客户与服务端中文自动回复聊天功能示例
2017/08/31 Python
Python插件virtualenv搭建虚拟环境
2017/11/20 Python
PyTorch预训练的实现
2019/09/18 Python
python字符串的拼接方法总结
2019/11/18 Python
python中的itertools的使用详解
2020/01/13 Python
Python中Pyspider爬虫框架的基本使用详解
2021/01/27 Python
主要的Ajax框架都有什么
2013/11/14 面试题
中职应届生会计求职信
2013/10/23 职场文书
会计专业个人自我鉴定
2014/03/21 职场文书
师范毕业生求职信
2014/07/11 职场文书
小学生美德少年事迹材料
2014/08/24 职场文书
党员查摆剖析材料
2014/10/10 职场文书