한국어
<!--把下列代码放到HEAD区域内--> <head> <title>连续环绕滚动图文</title> <script type='text/javascript'> function carousel(params){ if(!(params .width>0 && isFinite(params.width)))params.width=100; if(!(params.height>0 && isFinite(params.height)))params.height=100; if(!(params.sides>2 && isFinite(params.sides)))params.sides=4; if(!(params.steps>0 && params.steps<100 && isFinite(params.steps)))params.steps=20; if(!(params.speed>0 && isFinite(params.speed)))params.speed=8; if(!(params.image_border_width>=0 && isFinite(params.image_border_width)))params.image_border_width=0; if(isFinite(params.id)||!params.id)params.id='bad_id_given_'+Math.random(); document.write("<div style='position:relative;overflow:hidden;' id='"+params.id.replace(/[rnt ]+/g,'_')+"' ></div>"); var cdiv=document.getElementById(params.id.replace(/[rnt ]+/g,'_')) cdiv.style.width=params.width+'px'; cdiv.style.height=params.height+'px'; cdiv.style.border=params.border; cdiv.style.position='상대적'; cdiv.style.overflow='숨김'; cdiv.title=params.id; var counter=0,spinning=true,interval=Math.floor(60000/params.sides/params.steps/params.speed)-5; 간격=isNaN(간격)?200:간격; var img_position=[],images=[],img_dimension=[]; var img_index=params.images.length+1,img_index_cap=2*params.images.length; var faces=Math.ceil(params.sides/2), 치수, 방향; 함수 초기화(){ if(params.direction=="왼쪽" || params.direction=="오른쪽"){ 방향=params.direction; 치수="너비"; } else if(params.direction=="top" || params.direction=="bottom"){ 방향=params.direction; 치수="높이"; } else { 방향="왼쪽"; 치수="너비"; } cdiv.style[차원]=params[차원]/(params.size_mode=='image'?Math.sin(Math.PI/params.sides):1)+'px'; var img=새 이미지(); img.style.position='절대'; img.style[방향]='10000px'; img.style.width=params.width-2*params.image_border_width+'px'; img.style.height=params.height-2*params.image_border_width+'px'; img.style.border=(params.image_border_width||0)+'px solid '+params.image_border_color; //http://www.downcodes.com의 추가 자바스크립트 for(var i=0;i<params.images.length;i++){ Images[i]=img.cloneNode(true); 이미지[i].src=params.images[i]; if(params.links && params.links[i] && params.links[i]!=''){ 이미지[i].onclick=new Function("window.location='"+params.links[i]+ "'"); 이미지[i].style.cursor=document.all?'손':'포인터'; } if(params.titles && params.titles[i] && params.titles[i]!='') 이미지[i].title=params.titles[i]; 이미지[i+params.images.length]=이미지[i]; if(params.images.length==얼굴) 이미지[i+2*params.images.length]=이미지[i]; cdiv.appendChild(이미지[i]); } var face_size=params.size_mode=='image'?params[dimension]:params[dimension]*Math.sin(Math.PI/params.sides); var face_offset=params[dimension]*Math.cos(Math.PI/params.sides)/(params.size_mode=='image'?Math.sin(Math.PI/params.sides):1)/2-. 5; var pi_piece=2*Math.PI/params.steps/params.sides; for(i=0;i<=params.steps*faces;i++){ img_dimension[i]=face_size*Math.sin(pi_piece*i); img_position[i]=(i<params.steps*params.sides/2)?Math.floor(params[dimension]/2/(params.size_mode=='image'?Math.sin(Math.PI/params. 측면):1)-face_offset*Math.cos(pi_piece*i)-img_dimension[i]/2)+'px':'10000px'; img_dimension[i]=img_dimension[i]-2*params.image_border_width>1?Math.ceil(img_dimension[i])-2*params.image_border_width+'px':'1px'; } } 초기화(); cdiv.rotate = function(){ setTimeout('document.getElementById("'+cdiv.id+'").rotate()',interval); if(!spinning) return; if(++counter>=params.steps){ 카운터=0; if(++img_index>=img_index_cap) img_index=params.images.length; } 이미지[img_index-faces].style[direction]='20000px'; for(var i=faces-1;i>=0;i--){ 이미지[img_index-i].style[direction]=img_position[counter+i*params.steps]; 이미지[img_index-i].style[dimension]=img_dimension[counter+i*params.steps]; } } cdiv.onmouseover=function(){ 회전=false; } cdiv.onmouseout=function(){ 회전=true; } setTimeout('document.getElementById("'+cdiv.id+'").rotate()',200); } </script> </head> <!--把下列代码放到body区域内--> <body> <h3>水平方向滚动</h3> <script type='text/javascript'> carousel({ id:'Amazon Books', //이 슬라이드쇼 인스턴스의 고유한 ID를 입력하세요. border:'', size_mode:'image', //"carousel" 또는 "image"를 입력하세요. 너비 및 높이 매개변수에 영향을 줍니다. 107, //위 값에 따라 이미지 또는 전체 캐러셀의 너비를 입력합니다. height:140, //위 값에 따라 이미지 또는 전체 캐러셀의 높이를 입력합니다. side:6, //표시되는 캐러셀 측면 수 = 측면/2. 측면/2< 전체 이미지가 포함된 정수가 가장 좋습니다: 23, //애니메이션 단계 수 더 많음 = 더 부드럽지만 CPU 집약적 속도: 5, //더 큰 방향: 더 빠릅니다. '왼쪽', //슬라이드쇼 방향. "상단", "하단", "왼쪽" 또는 "오른쪽" 이미지 입력:['', '', '', ''], 링크: ['http:/ /www.downcodes.com/', 'http://www.downcodes.com/', 'http://www.downcodes.com/', 'http://www.downcodes.com/'], 제목 :['javascript特效', '网络school院', '网站联盟', '插件下载'], image_border_width:1, image_border_color:'blue' }); </script> <h3>竖直方向滚动</h3> <script type='text/javascript'> carousel({id:'carousel_1', //이 슬라이드쇼 인스턴스 테두리의 임의적이지만 고유한 ID를 입력하세요:'', size_mode:'image', //"carousel" 또는 "image"를 입력합니다. 아래의 너비 및 높이 매개변수에 영향을 줍니다. width:107, //위 값에 따라 이미지 또는 전체 캐러셀의 너비를 입력합니다. height:140, //Enter 위의 값에 따라 이미지 또는 전체 캐러셀의 높이입니다: 8, //캐러셀의 측면 수 표시되는 내용 = 측면/2. 측면/2< 전체 이미지가 있는 짝수 정수는 8, //#입니다. 애니메이션 단계 더 많음 = 더 부드럽지만 CPU 집약적 속도: 7, //슬라이드쇼 속도. 더 빠름. 방향:'위쪽', //슬라이드쇼 방향을 입력합니다. 또는 "오른쪽" 이미지:['', '', '', ''], 링크: [], 제목:[], image_border_width:1, image_border_color:'black' }); </script> </body>
