画像が中央からズームアップしながら出るスライドショー
画像は出来るだけ全て 同じ大きさの物をお使い下さい
違うとガタつきます 一応主要ブラウザ全て動作OKか？
下のテキストエリアの内部をクリックで テキストエリアの中のソースを一発でコピーします
クリックした後それをそのままメモ帳等に貼り付け 適当な名前のHTMLで保存して下さい
Mac & Windows NetScapeは反転のみなので Ctrl+Cキーでその後コピーして下さい
このスクリプトのソース
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>ズームアップスライドショー</title> <body> <!--■bodyの表示したい部分に以下フォームタグを入れて下さい--> <form> <input type="button" onclick="hazime();" value="自動"> <input type="button" onclick="tome();" value="自動停止"> <input type="button" onclick="saki();" value="手動：前"> <input type="button" onclick="ato();" value="手動：次"></form> <!--■ここまで入れる--> <!--■以下スクリプトをbody内に入れて下さい--> <script type="text/JavaScript"> <!--http://myako.net/ ako's cyberpage var yoko=220;//■画像の幅 var takasa=290;//■画像の高さ var kirikae=4000;//■切り替えの速さ（現在4秒設定） Ga=new Array();var su=0; Ga[su++]="sena/senachan2.jpg";//■一枚目の画像名 Ga[su++]="sena/hokkamuri.jpg";//■二枚目の画像名 Ga[su++]="sena/senachan1.jpg";//■以下順番にいくつでも Ga[su++]="sena/senamegane.jpg"; var suu=Ga.length;var M=takasa/40;var zi,Idz; GaO=new Array();for(zi=0;zi<suu;zi++){ GaO[zi]=new Image();GaO[zi].src=Ga[zi];} document.write('<table style="width:'+(yoko+20)+';border:none"><tr>'); document.write('<td align="center" id="com" style="font-size:14px;color:#ff7678;font-family:HG丸ｺﾞｼｯｸM-PRO">停止中'); //■↑「現在自動中 何枚目」等の文字の大きさ･色・書体 document.write('</td></tr><tr>'); document.write('<td align="center" id="akocom" style="background:url('+GaO[0].src+') center no-repeat; height:'+(takasa+20)+';">'); document.write('<img id="akoGa">'); document.write('</td></tr></table>'); var Id,genzai="手動中",kazu=0; document.getElementById("akoGa").src=GaO[kazu].src;suu_dasu(); function hazime(){ clearInterval(Id);genzai="自動中"; ato();Id=setInterval("ato();",kirikae);} function saki(){ if(kazu>0){kazu--;G_dasu();suu_dasu(); }else{ kazu=suu-1;G_dasu();suu_dasu();}} function ato(){ if(kazu<suu-1){kazu++;G_dasu();suu_dasu(); }else{ kazu=0;G_dasu();suu_dasu();}} function tome(){ clearInterval(Id);genzai="手動中";suu_dasu();} function henkou(bangou){kazu=bangou;dasu();} function G_dasu(){ document.getElementById("akoGa").style.height=M+"px"; document.getElementById("akoGa").src=GaO[kazu].src;Zoom();} function suu_dasu(){ var susu="現在 "+genzai+" ◆ "+suu+" 枚中 "+(kazu+1)+" 枚目の画像"; document.getElementById("com").firstChild.nodeValue=susu;} function Zoom(){ clearInterval(Idz);zi=M;Idz=setInterval("betuW();",20);} function betuW(){ zi+=M;if(zi<takasa+M){ document.getElementById("akoGa").style.height=zi+"px"; }else{ clearInterval(Idz); document.getElementById("akocom").style.backgroundImage="url('"+GaO[kazu].src+"')";}} //--> </script> <!--■ここまで入れる--> </p> ソースを開いて■から書かれているコメントに従って御自分用に書きなおして下さい<br> スクリプトご使用の際は以下リンクをお入れください<br> <a href="http://myako.net/" target="_top">Script by ako's cyberpage</a> </body> </html>
Script by ako's cyberpage