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 相关文章推荐
js 对联广告、漂浮广告封装类(IE,FF,Opera,Safari,Chrome
Nov 26 Javascript
node.js中的dns.getServers方法使用说明
Dec 08 Javascript
jQuery的end()方法使用详解
Jul 15 Javascript
跟我学习javascript的prototype,getPrototypeOf和__proto__
Nov 17 Javascript
JavaScript脚本库编写的方法
Dec 09 Javascript
js表单提交和submit提交的区别实例分析
Dec 10 Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
Dec 14 Javascript
微信小程序实现给嵌套template模板传递数据的方式总结
Dec 18 Javascript
利用js给datalist或select动态添加option选项的方法
Jan 25 Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 jQuery
详解JavaScript栈内存与堆内存
Apr 04 Javascript
vue样式穿透 ::v-deep的具体使用
Jun 04 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合并静态文件详解
2014/11/14 PHP
IE不出现Flash激活框的小发现的js实现方法
2007/09/07 Javascript
javascript 面向对象的JavaScript类
2010/05/04 Javascript
jquery之超简单的div显示和隐藏特效demo(分享)
2013/07/09 Javascript
Angularjs注入拦截器实现Loading效果
2015/12/28 Javascript
字符串反转_JavaScript
2016/04/28 Javascript
JavaScript实现打开链接页面的方式汇总
2016/06/02 Javascript
基于jQuery实现Tabs选项卡自定义插件
2016/11/21 Javascript
微信小程序登录态控制深入分析
2017/04/12 Javascript
详解Javascript获取缓存和清除缓存API
2017/05/25 Javascript
详解AngularJS2 Http服务
2017/06/26 Javascript
vue-cli webpack 引入jquery的方法
2018/01/10 jQuery
vue 简单自动补全的输入框的示例
2018/03/12 Javascript
JavaScript格式化json和xml的方法示例
2019/01/22 Javascript
js中async函数结合promise的小案例浅析
2019/04/14 Javascript
JavaScript this使用方法图解
2020/02/04 Javascript
基于vue-cli3+typescript的tsx开发模板搭建过程分享
2020/02/28 Javascript
如何在 ant 的table中实现图片的渲染操作
2020/10/28 Javascript
vue中axios封装使用的完整教程
2021/03/03 Vue.js
[03:07]完美世界DOTA2联赛PWL DAY10 决赛集锦
2020/11/11 DOTA
忘记ftp密码使用python ftplib库暴力破解密码的方法示例
2014/01/22 Python
Python time模块详解(常用函数实例讲解,非常好)
2014/04/24 Python
轻松掌握python设计模式之访问者模式
2016/11/18 Python
Python实现判断字符串中包含某个字符的判断函数示例
2018/01/08 Python
Python使用Selenium爬取淘宝异步加载的数据方法
2018/12/17 Python
利用selenium爬虫抓取数据的基础教程
2019/06/10 Python
python中count函数简单用法
2020/01/05 Python
Tensorflow tf.dynamic_partition矩阵拆分示例(Python3)
2020/02/07 Python
Pretty Little Thing爱尔兰:时尚女性服饰
2017/03/27 全球购物
奥斯汀独木舟和皮划艇:Austin Canoe & Kayak
2018/05/22 全球购物
求职简历自荐信范文
2013/10/21 职场文书
祖国在我心中演讲稿
2014/01/15 职场文书
股份转让协议书范本
2015/01/27 职场文书
2015年度高中教师工作总结
2015/05/26 职场文书
MySQL infobright的安装步骤
2021/04/07 MySQL
SQL使用复合索引实现数据库查询的优化
2022/05/25 SQL Server