javascript AutoScroller 函数类


Posted in Javascript onMay 29, 2009
/* 
* Copyright (C) 2007-2009 skylark 
* Email:aohailin@gmail.com 
* Version:2.1 
* 原创程序,转载请保留版权 
*/ 
var $=function(o){return typeof o=="string"?document.getElementById(o):o;}; 
function AutoScroll(){ 
this.obj=[]; 
this.version="2.1"; 
this.Build();//初始化 
}; 
AutoScroll.prototype.Build=function(){ 
var me=this; 
//取得其他滚动事件 
var oldscroll=window.onscroll; 
window.onscroll=function(){ 
//保护其他滚动事件 
if("function"==typeof oldscroll){ 
oldscroll(); 
} 
//得到客户端浏览器参数,兼容IE,FF,Chrome 
this.common={ 
t:document.documentElement.scrollTop||document.body.scrollTop, 
h:document.documentElement.clientHeight||document.body.clientHeight, 
w:document.documentElement.clientWidth||document.body.clientWidth 
}; 
this.position=[]; 
for(var i=0;i<me.obj.length;i++){ 
try{ 
this.style={}; 
//获得客户端位置,设置了7种位置 
//为了让最小化自动适应位置,这里动态计算位置,所以滚动事件触发时,CPU消耗很大 
this.position[i]=[ 
{x:0,y:this.common.t}, 
{x:this.common.w-me.obj[i].obj.offsetWidth,y:this.common.t}, 
{x:0,y:(this.common.h+this.common.t-me.obj[i].obj.offsetHeight)/2+(this.common.t)/2}, 
{x:this.common.w-me.obj[i].obj.offsetWidth,y:(this.common.h+this.common.t-me.obj[i].obj.offsetHeight)/2+(this.common.t)/2}, 
{x:(this.common.w-me.obj[i].obj.offsetWidth)/2,y:(this.common.h+this.common.t-me.obj[i].obj.offsetHeight)/2+(this.common.t)/2}, 
{x:0,y:this.common.h+this.common.t-me.obj[i].obj.offsetHeight}, 
{x:this.common.w-me.obj[i].obj.offsetWidth,y:this.common.h+this.common.t-me.obj[i].obj.offsetHeight} 
]; 
//处理自定义样式 
this.style="object"==typeof me.obj[i].style?{x:me.obj[i].style.left,y:me.obj[i].style.top+this.common.t}:{x:this.position[i][me.obj[i].style].x,y:this.position[i][me.obj[i].style].y}; 
//定位 
me.obj[i].obj.style.left=this.style.x+"px"; 
me.obj[i].obj.style.top=this.style.y+"px"; 
}catch(e){ 
//功能是过滤无效obj 
for(var j=i;j<me.obj.length-1;j++){ 
me.obj[j]=me.obj[j+1]; 
me.obj.length=me.obj.length-1; 
} 
} 
} 
}; 
//初始化 
window.scroll(1,1); 
}; 
AutoScroll.prototype.Add=function(){ 
var obj=arguments[0]; 
//获得当前position 
var oldposition=$(obj.id).style.position; 
$(obj.id).style.position="absolute"; 
//不使用fixed,虽然高版本浏览器都已经支持fixed 
this.obj.push({ 
obj:$(obj.id), 
oldposition:oldposition, 
style:obj.style 
}); 
}; 
AutoScroll.prototype.Remove=function(){ 
var obj=arguments[0]; 
for(var i=0;i<this.obj.length;i++){ 
if(this.obj[i].obj==$(obj.id)){ 
//还原初始状态position 
this.obj[i].obj.style.position=this.obj[i].oldposition; 
//是否真正移除 
if(obj.remove){ 
this.obj[i].obj.innerHTML=""; 
document.body.removeChild(this.obj[i].obj); 
} 
//移除obj 
for(var j=i;j<this.obj.length-1;j++){ 
this.obj[j]=this.obj[j+1]; 
} 
this.obj.length=this.obj.length-1; 
break; 
} 
} 
}; 
var Scroller=new AutoScroll();
Javascript 相关文章推荐
javascript 添加和移除函数的通用方法
Oct 20 Javascript
JavaScript中的apply()方法和call()方法使用介绍
Jul 25 Javascript
jquery实现marquee效果(文字或者图片的水平垂直滚动)
Jan 07 Javascript
IE与FF下javascript获取网页及窗口大小的区别详解
Jan 14 Javascript
JavaScript格式化日期时间的方法和自定义格式化函数示例
Apr 04 Javascript
js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件实例
Apr 29 Javascript
JS实现物体带缓冲的间歇运动效果示例
Dec 22 Javascript
作为老司机使用 React 总结的 11 个经验教训
Apr 08 Javascript
详解Vue用cmd创建项目
Feb 12 Javascript
JQuery特殊效果和链式调用操作示例
May 13 jQuery
微信小程序云开发之使用云存储
May 17 Javascript
Vue两种组件类型:递归组件和动态组件的用法
Aug 06 Javascript
关于JavaScript的一些看法
May 27 #Javascript
广告切换效果(缓动切换)
May 27 #Javascript
js 图片缩放(按比例)控制代码
May 27 #Javascript
图片上传即时显示缩略图的js代码
May 27 #Javascript
JavaScript 闭包深入理解(closure)
May 27 #Javascript
jQuery 剧场版 你必须知道的javascript
May 27 #Javascript
javascript 日期时间函数(经典+完善+实用)
May 27 #Javascript
You might like
PHP 网络开发详解之远程文件包含漏洞
2010/04/25 PHP
PHP用GD库生成高质量的缩略图片
2011/03/09 PHP
php中stdClass的用法分析
2015/02/27 PHP
PHP附件下载中文名称乱码的解决方法
2015/12/17 PHP
php处理复杂xml数据示例
2016/07/11 PHP
PHP设计模式之工厂模式与单例模式
2016/09/28 PHP
js基于qrcode.js生成二维码的方法【附demo插件源码下载】
2016/12/28 PHP
php微信公众号开发之简答题
2018/10/20 PHP
破除一些网站复制、右键限制
2006/11/04 Javascript
JavaScript对象模型-执行模型
2008/04/28 Javascript
jQuery如何将选中的对象转化为原始的DOM对象
2014/06/09 Javascript
angularjs自定义ng-model标签的属性
2016/01/21 Javascript
超赞的jQuery图片滑块动画特效代码汇总
2016/01/25 Javascript
原生JavaScript实现动态省市县三级联动下拉框菜单实例代码
2016/02/03 Javascript
使用Node.js处理前端代码文件的编码问题
2016/02/16 Javascript
jQuery实现的倒计时效果实例小结
2016/04/16 Javascript
iOS和Android用同一个二维码实现跳转下载链接的方法
2016/09/28 Javascript
JS表单数据验证的正则表达式(常用)
2017/02/18 Javascript
JQuery实现文字无缝滚动效果示例代码(Marquee插件)
2017/03/07 Javascript
es6数值的扩展方法
2019/03/11 Javascript
vue实现微信浏览器左上角返回按钮拦截功能
2020/01/18 Javascript
Python中比较特别的除法运算和幂运算介绍
2015/04/05 Python
Python cookbook(数据结构与算法)将名称映射到序列元素中的方法
2018/03/22 Python
浅谈Python批处理文件夹中的txt文件
2019/03/11 Python
Python实现串口通信(pyserial)过程解析
2019/09/25 Python
python+selenium定时爬取丁香园的新型冠状病毒数据并制作出类似的地图(部署到云服务器)
2020/02/09 Python
python 三种方法提取pdf中的图片
2021/02/07 Python
Tommy Hilfiger美国官网:美国高端休闲领导品牌
2019/01/14 全球购物
Java面试笔试题大全
2016/11/23 面试题
学生的自我鉴定范文
2013/10/24 职场文书
施工安全承诺书
2014/05/22 职场文书
中秋联欢会主持词
2015/07/04 职场文书
2019餐饮行业创业计划书!
2019/06/27 职场文书
golang中实现给gif、png、jpeg图片添加文字水印
2021/04/26 Golang
python如何利用traceback获取详细的异常信息
2021/06/05 Python
python可视化之颜色映射详解
2021/09/15 Python