TOP /その他のJavaScript 画像のスクロール


<center>
<IFRAME src = "slidechange.html"name="imgframe" height=225 width=550 frameborder=0></IFRAME><br>

<button onclick="imgframe.flag_c=1;"><<</button><button
 onclick="imgframe.flag_c=2;">□</button><button
 onclick="imgframe.flag_c=0;">>></button>
</center>
slidechange.html
<html><head>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=Shift_JIS">
<meta http-equiv="imagetoolbar" content="no">
<TITLE>画像スライド</TITLE>
<style type=text/css><!--
.imgc{position:absolute;top:0px;}
body{overflow: hidden}
--></style>
</head>
<BODY>
<script type="text/javascript"><!--
chimg=new Array("01.jpg","02.jpg","03.jpg");    //使用画像
//増やす場合は("ファイル名","ファイル名","ファイル名","ファイル名")のように増やします
w=300;     //画像幅
//-----------------------------------------------------------
chimg = chimg.concat(chimg);     
flag_c=1;imgleft=0;
document.write("<div class='imgc' id='img_table'>");
document.write("<table border='0'cellspacing ='0' cellpadding ='0'><tr>");
for(i=0;i<chimg.length;i++){
document.write("<td><img src='"+chimg[i]+"'border=0></td>");
}
document.write("</tr></table></div>");
function slide(){
if(!flag_c){
if(imgleft >= 0)
imgleft=-w*chimg.length/2;
imgleft+=2;
}else
if(flag_c==1){
if(imgleft <= -w*chimg.length/2)
imgleft=0
imgleft-=2;
}
document.getElementById("img_table").style.left=imgleft;
setTimeout("slide()",100);
}

onload=slide;
/*himajin.moo.jp*/
// --></script>

</body></html>

360°切れ目の無い画像を用意すればパノラマになります。