javascript 一段左右两边随屏滚动的代码


Posted in Javascript onJune 18, 2009
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>一段左右两边随屏滚动的代码</title> 
</head> <body> 
<script language="javascript"> 
var delta=0.15 
var collection; 
var closeB=false; 
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() 
{ 
if(screen.width<=648||closeB) 
{ 
for(var i=0;i<collection.length;i++) 
{ 
collection[i].object.style.display='none'; 
} 
return ; 
} 
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.documentElement.scrollLeft+followObj_x)) 
{ 
var dx=(document.documentElement.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.documentElement.scrollTop+followObj_y)) 
{ 
var dy=(document.documentElement.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=''; 
} 
} 
function closeBanner() 
{ 
closeB=true; 
return ; 
} 
var theFloaters=new floaters(); 
// 
theFloaters.addItem('followDiv2',22,238,'<a href=http://idc.66so.com/ target=_blank><img src=http://www.asp300.com/adimg/66so.gif border=0></a><br><br><a href=http://www.red.net.cn target=_blank><img src=http://www.asp300.com/adimg/red.gif border=0></a><br><br><a href=http://www.wiidc.com target=_blank><img src=http://www.asp300.com/adimg/wiidc.gif border=0></a><br><br><img align=right src=http://www.asp300.com/images/ADclose.gif border=0 onClick="closeBanner();">'); 
theFloaters.addItem('followDiv1','document.body.clientWidth-100',238,'<a href=http://www.zgdata.com/stat/stat.asp?siteKey=asp300&pageNO=1&urlCode=91a3ed97bd9897d315ff6bfaba46a8ee target=_blank><img src=http://www.asp300.com/adimg/zgdata.gif border=0 height=80 width=80></a><br><br><a href=http://www.go020.net/style/info/host.asp?typeid=1 target=_blank><img src=http://www.asp300.com/adimg/go020.gif border=0></a><br><br><a href=http://www.phsjnet.com target=_blank><img src=http://www.asp300.com/adimg/phsjnet.gif border=0></a><br><br><img align=right src=http://www.asp300.com/images/ADclose.gif border=0 onClick="closeBanner();">'); 
theFloaters.play(); 

</script> 
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 
</body> 
</html>

打包下载
Javascript 相关文章推荐
用jQuery实现检测浏览器及版本的脚本代码
Jan 22 Javascript
js下写一个事件队列操作函数
Jul 19 Javascript
window.navigate 与 window.location.href 的使用区别介绍
Sep 21 Javascript
jQuery动态显示和隐藏datagrid中的某一列的方法
Dec 11 Javascript
js特殊字符过滤的示例代码
Mar 05 Javascript
javascript数组输出的两种方式
Jan 13 Javascript
Node.js实用代码段之获取Buffer对象字节长度
Mar 17 Javascript
vue的props实现子组件随父组件一起变化
Oct 27 Javascript
基于vue-resource jsonp跨域问题的解决方法
Feb 03 Javascript
基于原生JS封装的Modal对话框插件的示例代码
Sep 09 Javascript
react的hooks的用法详解
Oct 12 Javascript
详解Vue数据驱动原理
Nov 17 Javascript
Input 特殊事件onpopertychange和oninput
Jun 17 #Javascript
jquery 上下滚动广告
Jun 17 #Javascript
jQuery Ajax文件上传(php)
Jun 16 #Javascript
JavaScript 高级语法介绍
Jun 15 #Javascript
JavaScript 撑出页面文字换行
Jun 15 #Javascript
jquery.alert 弹出式复选框实现代码
Jun 15 #Javascript
论坛里点击别人帖子下面的回复,回复标题变成“回复 24# 的帖子”
Jun 14 #Javascript
You might like
PHP模板引擎SMARTY
2006/10/09 PHP
也谈php网站在线人数统计
2008/04/09 PHP
php添加数据到xml文件的简单例子
2016/09/08 PHP
Windows 下安装 swoole 图文教程(php)
2017/06/05 PHP
PHP实现对文件锁进行加锁、解锁操作的方法
2017/07/04 PHP
JavaScript和ActionScript的交互实现代码
2010/08/01 Javascript
突发奇想的一个jquery插件
2010/11/19 Javascript
怎样在JavaScript里写一个swing把数据插入数据库
2012/12/10 Javascript
JQuery实现倒计时按钮具体方法
2013/11/14 Javascript
javascript跨浏览器的属性判断方法
2014/03/16 Javascript
javascript实现设置、获取和删除Cookie的方法
2015/06/01 Javascript
Windows下用PyCharm和Visual Studio开始Python编程
2015/10/26 Javascript
详解AngularJs中$resource和restfu服务端数据交互
2016/09/21 Javascript
JS实现的系统调色板完整实例
2016/12/21 Javascript
Javascript(es2016) import和require用法和区别详解
2017/08/11 Javascript
VueRouter导航守卫用法详解
2017/12/25 Javascript
vue-cli项目优化方法- 缩短首屏加载时间
2018/04/01 Javascript
JavaScript常见JSON操作实例分析
2018/08/08 Javascript
使用 Node.js 实现图片的动态裁切及算法实例代码详解
2018/09/29 Javascript
详解多页应用 Webpack4 配置优化与踩坑记录
2018/10/16 Javascript
使用jquery的cookie实现登录页记住用户名和密码的方法
2019/03/13 jQuery
Vue跨域请求问题解决方案过程解析
2020/08/07 Javascript
Python彩色化Linux的命令行终端界面的代码实例分享
2016/07/02 Python
深入理解Python中的内置常量
2017/05/20 Python
python3+PyQt5使用数据库表视图
2018/04/24 Python
pyspark 随机森林的实现
2020/04/24 Python
python opencv肤色检测的实现示例
2020/12/21 Python
基于Python的接口自动化读写excel文件的方法
2021/01/15 Python
抽象类和接口的区别
2012/09/19 面试题
报关专员求职信范文
2014/02/22 职场文书
酒鬼酒广告词
2014/03/21 职场文书
创业者迈进成功第一步:如何写创业计划书?
2014/03/22 职场文书
大班开学家长寄语
2014/04/04 职场文书
邹越感恩父母演讲稿
2014/08/28 职场文书
2014年法院工作总结
2014/11/24 职场文书
如何在CocosCreator里画个炫酷的雷达图
2021/04/16 Javascript