日本語
<!-- 下列コードを 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; varface=Math.ceil(params.sides/2)、寸法、方向; function init(){ if(params.direction=="left" || params.direction=="right"){ 方向=params.direction;寸法 = "幅"; } else if(params.direction=="top" || params.direction=="bottom"){direction=params.direction;寸法 = "高さ"; } else { 方向 = "左";寸法 = "幅"; cdiv.style[dimension]=params[dimension]/(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 ソリッド '+params.image_border_color; //http://www.downcodes.com からのその他の JavaScript 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]!=''){images[i].onclick=new Function("window.location='"+params.links[i]+ "");画像[i].style.cursor=document.all?'hand':'pointer'; if(params.titles && params.titles[i] && params.titles[i]!='') image[i].title=params.titles[i];画像[i+params.images.length]=画像[i]; if(params.images.length==faces) 画像[i+2*params.images.length]=画像[i]; cdiv.appendChild(images[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'; init(); cdiv.rotate = function(){ setTimeout('document.getElementById("'+cdiv.id+'").rotate()',interval); if(!スピニング) リターン; if(++counter>=params.steps){counter=0; if(++img_index>=img_index_cap) img_index=params.images.length;画像[img_index-faces].style[方向]='20000px'; for(var i=faces-1;i>=0;i--){images[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(){ Spin=false; } } cdiv.onmouseout=function(){スピニング=true; setTimeout('document.getElementById("'+cdiv.id+'").rotate()',200); } </script> </head> <!--ボディ領域内に下列コードを放出します--> <body> <h3>水平方向滚動</h3> <script type='text/javascript'> carousel({ id:'Amazon Books', //このスライドショー インスタンスの任意の固有の ID を入力します border:'', size_mode:'image', //「carousel」または「image」を入力します 以下の幅と高さのパラメータに影響します。 107, //上記の値に応じて画像またはカルーセル全体の幅を入力します height:140, //上記の値に応じて画像またはカルーセル全体の高さを入力します Side:6, // 表示される内容 =面数/2 の整数が画像合計の場合は 23 が最適です。 // アニメーションのステップ数が多くなります。ただし、CPU 負荷が高くなります。 5、 // スライドショーの速度が速くなります。 'left', //スライドショーの方向を「上」、「下」、「左」、または「右」を入力してください。 image:['', '', '', '']、links: ['http:/ /www.downcodes.com/'、'http://www.downcodes.com/'、'http://www.downcodes.com/'、'http://www.downcodes.com/']、タイトル:['javascript特效', '网络学院', '网站联盟', '插件下ダウンロード'], image_border_width:1, image_border_color:'blue' }); </script> <h3>竖直方向滚動</h3> <script type='text/javascript'> carousel({id:'carousel_1', //このスライドショー インスタンスの任意だが一意の ID を入力します border:'', size_mode:'image', //「カルーセル」または「イメージ」と入力します。以下の幅と高さのパラメータに影響します。 width:107, //上記の値に応じて、画像またはカルーセル全体の幅を入力します。 height:140, //Enter画像またはカルーセル全体の高さ (上記の値に応じて) 側面:8, //カルーセルの側面の数 = 側面/2 の整数が画像全体よりも最適なステップ:8, //アニメーションのステップが多いほどスムーズになりますが、CPU 負荷が高くなります。speed:7, //スライドショーの速度が大きくなります。direction:'top', //スライドショーの方向を「上」、「下」、「左」と入力します。または「右」画像:['', '', '', '']、リンク: []、タイトル:[]、image_border_width:1、image_border_color:'black' }); </script> </body>
