使用した画像 :
HATUHI.GIF
HAKEN.GIF
BOTAN.GIF
ISHI.GIF
CHOZU.GIF
HOKUSAI.GIF
HONB.GIF
HOZAKI.GIF
KAWARA.GIF
970101.GIF
ATO11.GIF
TEIEN.GIF
SlideShow ボタンをクリックするとサブウインドウのなかの画像が1秒毎に書き換えられます。NN3.0から使えます。
|
T o s h r o u T a k a h a s h i
T '
|
<html>
<head>
<title></title>
<script language="JavaScript">
<!--
var wName = "w1"; //サブウィンドウの名前
var maisu = 12 ; //画像枚数
//画像の事前読み込み
if(document.images){
movimg=new Array(maisu)
//ここの画像名を取り替えて使ってください。
movimg[0] = new Image();movimg[0].src = 'HATUHI.GIF'
movimg[1] = new Image();movimg[1].src = 'HAKEN.GIF'
movimg[2] = new Image();movimg[2].src = 'BOTAN.GIF'
movimg[3] = new Image();movimg[3].src = 'ISHI.GIF'
movimg[4] = new Image();movimg[4].src = 'CHOZU.GIF'
movimg[5] = new Image();movimg[5].src = 'HOKUSAI.GIF'
movimg[6] = new Image();movimg[6].src = 'HONB.GIF'
movimg[7] = new Image();movimg[7].src = 'HOZAKI.GIF'
movimg[8] = new Image();movimg[8].src = 'KAWARA.GIF'
movimg[9] = new Image();movimg[9].src = '970101.GIF'
movimg[10] = new Image();movimg[10].src = 'ATO11.GIF'
movimg[11] = new Image();movimg[11].src = 'TEIEN.GIF'
}
//表紙
title0 = "<center><b><h3>PHOTO</h><br>"
+ "<font size=6>WINDOW</font></b></center>"
//タイトルと最初に表示する画像(瓦)
title1 = "<h3>PHOTO</h><br><font size=5>WINDOW</font>"
+ "<hr><img src='KAWARA.GIF'><br>"
//裏表紙?ばいばい(^^)/~
title2 = "<center><h3>(^^)/~</h><br>"
+ "<font size=6>ばいばい</font></center>"
//BACKGROUNDの指定(表紙と裏表紙?ばいばい用)
bg0 = "<body bgcolor='#444444' text='#000000'>"
//BACKGROUNDの指定
bg1 = "<body bgcolor='#aaaaaa' text='#ffffff'>"
//photoWindowの基本動作
function phWin(bg,sashikae){
phWin1 =
window.open('',wName,'resizable=1,width=260,height=300')
phWin1.document.write(bg)
phWin1.document.write("<br><br><br><br><br><p>")
phWin1.document.write(sashikae)
phWin1.document.close()
//NN3.0~ならphotoWindowを手前にする
if(navigator.appVersion.charAt(0)>=3){phWin1.focus()}
}
//表紙をサブウインドウに表示する
function strtW(){
phWin(bg0,title0) //phWin(bg0,title0)を実行する
setTimeout('kawaraW()',1000);//1秒後にkawaraW()を実行する
}
//瓦タイトルをサブウインドウに表示する
function kawaraW(){
phWin(bg1,title1) //phWin(bg1,title1)を実行する
}
//サブウインドウを閉じる
function closeW(){
phWin(bg0,title2) //phWin(bg0,title2)を実行する
phWin1.close() //phWin1を閉じる
}
//画像の書き換え処理 スライドショー
var i=0 //表示枚数のカウント
var stimeID //スライドショー用タイマー
var sspeed =1000 //切り替えスピード
function sShow(){
//サブウィンドウclose時のエラー回避
if( !phWin1.closed ){
//NN3.0以上ならphotoWindowを手前にして画像書き換え処理
if(navigator.appVersion.charAt(0)>=3){
phWin1.focus()
phWin1.document.images[0].src=movimg[i].src
}
if( i < maisu - 1 ){
i++;
stimeID=setTimeout('sShow()',sspeed)
} else {
clearTimeout(stimeID)
}
}
}
strtW(); //strtW()の実行
//-->
</script>
</head>
</body>
<center>
<table border=4 bgcolor="#aaaaaa" width="300"
><tr><td>
<center>
<p>
<b>
<font COLOR=red>T</font> o s h r o u
<font COLOR=green>T</font> a k a h a s h i
</b>
<br>
P h o t o g r a p h i c S h o w (^0^)/
<hr>
<b>
<font size=7 COLOR=gold>T</font>
<font size=7 COLOR=pink>'</font>
</b>
<table border=4 WIDTH=12%><tr><td></td></tr></table>
<form>
<input type="button" value=" SlideShow "
onClick="i=0;sShow()">
</form>
<p>
<a HREF="javascript:strtW()">open</a>/<a
HREF="javascript:closeW()">close</a> <p>
</center>
</td></tr></table>
</center>
</body>
</html>
使用した画像 :
| CONTENTS
| PART1 これだけ知っていれば大丈夫
| PART2 サンプルの紹介
| PART3 JavaScript言語仕様
| PART4 JavaScriptクイック書式一覧
| PART5 JavaScriptサイト
| オンラインサポートページ(回線をつないでください)