<![CDATA[
<HTML>
<HEAD>
<meta name="viewport" content="width=device-width">
<META http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<META http-equiv="Content-Script-Type" content="text/JavaScript">
<TITLE>ミラーパノラマ</TITLE>
<SCRIPT language="javascript">
]]><!--<![CDATA[
//写真
syasin="./a01.jpg";//写真ファイル名
tp=100; //写真を表示する縦位置
//ユーザー環境
nav=navigator.appName.substring(0,1);//ブラウザ
scr_l=screen.width; //ディスプレーの横幅
scr_h=screen.height; //ディスプレーの縦幅
roll_l=scr_l*2;
///スクロール初期設定///
x=10; //スタート位置
rl=1; //スクロールスピード
///アニメ初期設定///
bx=1; //スピード
bxx=150;byy=120; //スタート位置
imgurl2="./mm02.gif"; //右向きイメージ
imgurl3="./mm01.gif"; //左向きイメージ
sy=0;
///画面の動き///
function mv(){
///スクロール///
x=x+rl;
if(x>roll_l+10){x=10;} //右スクロールをエンドレスに
if(x<10){x=roll_l+10;} //左スクロールをエンドレスに
document.getElementById("hekiga").style.top = tp ;
document.getElementById("hekiga").style.left =x*-1 ;
///アニメの動き///
scr_l=document.body.clientWidth;//ウィンドウの幅
if(bxx>scr_l-50){ //右端で反転
bx=-4;
document.ball.src = imgurl3;
}
if(bxx<5){ //左端で反転
bx=4;
document.ball.src = imgurl2;
}
document.getElementById("qpon").style.top = byy;
document.getElementById("qpon").style.left =bxx;
bxx=bxx+bx;
//上下動
sy=sy+0.3;
by=4*Math.sin(sy);
byy=byy+by;
tim2=setTimeout("mv()",50);
}
//アニメで静止
function stp(){
clearTimeout(tim2);
}
//アニメで再開
function go(){
tim2=setTimeout("mv()",50);
}
//ボタンで切り替え//
function xy(c){
rl=c;
}
//-->
</SCRIPT>
</HEAD>
<BODY onload="mv();">
<script type = "text/javascript">
]]>
<!--
<![CDATA[
//写真
document.writeln('<div id="hekiga" style="position:absolute;top:',tp,';left:0">');
document.writeln('<table border=10 width=',scr_l*3,' height=10><tr><td>');
document.writeln('<table border=0 cellspacing=0 cellpadding=0><tr>');
document.writeln('<td><img src="',syasin,'" width=',scr_l,' name="img1"></td>');
document.writeln('<td><img src="',syasin,'" width=',scr_l);
if(nav=="M"){
document.writeln(' style="filter:flipH(enabled=1) flipV(enabled=0);">');
}else{
document.writeln(' style="transform: rotateY( 180deg );-webkit-transform: rotateY(180deg);">');
}
document.writeln('<td><img src="',syasin,'" width=',scr_l,'></td>');
document.writeln('</td></tr></table></td></tr></table>');
document.writeln('</div>');
///アニメ
document.writeln('<div id="qpon" style="position:absolute"; display="block";>');
document.writeln('<img name="ball" src="',imgurl2,'" onMouseOver="stp()" onMouseOut="go()">');
document.writeln('</div>');
///ボタン
document.writeln('<div id="button" style="position:absolute;top :',(tp+30),';left:10;">');
document.writeln('<form>');
document.writeln('<table>');
document.writeln('<tr><th><input type=button value="<<" onClick="xy(10)"></th></tr>');
document.writeln('<tr><th><input type=button value="←" onClick="xy(2)"></th></tr>');
document.writeln('<tr><th><input type=button value="×" onClick="xy(0)"></th></tr>');
document.writeln('<tr><th><input type=button value="→" onClick="xy(-2)"></th></tr>');
document.writeln('<tr><th><input type=button value=">>" onClick="xy(-10)"></th></tr>');
document.writeln('</table>');
document.writeln('</form>');
document.writeln('</div>');
//-->
</script>
</center>
</BODY>
</HTML>
]]>
ソースをお使いの場合は出来るだけ私のホームページにリンクを貼ってください。
ＵＲＬ：http://www2a.biglobe.ne.jp/~qpon/ バナー：
|