３６０度回転パノラマのソースを提供します。
ファイルは index.html と main.html と controll.html の３つあります。
上下２段のフレーム構造です。
(もう一つtitle.htmlを作り３段にしてもよい）
全て同じフォルダに入れます。jsファイルはありません。
写真は３６０度に繋いだ１枚の写真です。
index.htmlファイルは下記です。
rows=430は写真の縦の幅より少し大きい値にします。（ここで使っている写真の幅は400pixです）
<![CDATA[
<html>
<head>
<title>360panorama</title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">
</head>
<frameset rows="430,*">
<frame src="main.html" name="scrol" border="0" marginheight=5>
<frame src="control.html" name="cont" marginheight=0>
</frameset>
<noframes>
フレーム機能を使用しています。フレーム対応のブラウザで試してください
</noframes>
</html>
]]>
main.html ファイルは下記です。
写真は同じものを２枚並べます。
ここではtableを使いました。
<![CDATA[
<html>
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">
<title>main</title>
</head>
<body bgcolor="#112233">
<table border="0" cellpadding="0" cellspacing="0" bgcolor="#112233">
<tr>
<td><img src="panorama138web.jpg"></td>
<td><img src="panorama138web.jpg"></td>
</tr>
</table>
</body>
</html>
]]>
control.html ファイルは下記です。
制御部です。
len=6991 は写真の横幅です。使う写真に合わせてください。
st=10 になっていますが、早く動かしたい場合は数字を小さく、逆は大きくしてください。
<![CDATA[
<html>
<head>
<META http-equiv="Content-Script-Type" content="text/javascript">
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=Shift_JIS">
<title>control</title>
<script language="JavaScript">
<!--
var i=0;
var len=6991;
var st=10;
var auto=0;
function scrl(){
auto=1;
if(auto==1 && i<len){i=i+1;
parent.scrol.window.scroll(i,0);
}
else{i=0}
tm=setTimeout("scrl()",st);
}
function scrl_off(){
auto=0;
clearTimeout(tm);
}
//-->
</script>
</head>
<body bgcolor="#112233" text="#ffffff" link="yellow" vlink="red" onLoad="scrl()">
<center>
<table>
<tr>
<td width="250">
<form name="kirikae">
<input type="button" value="手動スクロール" onClick="scrl_off()">
<input type="button" value="AUTO再開" onClick="scrl()">
</form></td>
</tr>
</table><p>
</center>
</body>
]]>
以上