> 웹 프론트엔드 > JS 튜토리얼 > javascript AutoScroller 함수 class_javascript 기술

javascript AutoScroller 함수 class_javascript 기술

WBOY
풀어 주다: 2016-05-16 18:52:09
원래의
1198명이 탐색했습니다.
코드 복사 코드는 다음과 같습니다.

/*
* Copyright (C) 2007- 2009 skylark
* 이메일:aohailin@gmail.com
* 버전: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;jme.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] ;
//현재 위치 가져오기
var oldposition=$(obj.id).style.position
$(obj.id).style.position="absolute"// 더 높은 버전의 브라우저에서는 이미 수정된 기능을 지원하지만 고정 기능을 사용하지 마세요.
this.obj.push({
obj:$(obj.id),
oldposition:oldposition,
style:obj.style
});
}; AutoScroll.prototype.Remove=function(){
var obj=arguments[0]
for(var i=0;iif(this .obj[i].obj==$(obj.id)){
//초기 상태 위치 복원
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;jthis.obj[j] =this.obj[j 1]
this.obj.length=this.obj.length-1;
break;
}
};
var Scroller=new AutoScroll();

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿