絵あわせパズルです。startをクリックすると20秒のカウントダウンウインドウが開きます。その間に、パズルを完成してください。sampleをクリックすると完成図が一瞬(^^;;だけみられます。ただし、サンプルを見た回数は最後に表示される得点からマイナスされます。
応用:画像を福笑いに変えてみるとか。顔写真であそぶ手もあります(^^)。
  |
SAMPLEの模様を覚えてToolsの断片で再現してください。
Toolsの断片をクリックしてからうえの画面のはりたい場所でもう一度clickします(^^)/
わからなくなったらSAMPLEを押すと一瞬だけ見れます。
ただ、SAMPLEを押した回数分得点はマイナスされます。
Netscape3.0以上用
<html>
<head>
<title></title>
<script language="JavaScript">
<!--
window.onerror=null; //エラーダイアログを出さない設定
//変数の宣言
var TimeID1; //タイマー1 カウントダウン用
var TimeID2; //タイマー2
var str=0; //ゲーム中なら1 違えば0
var co; //画像NAMEに振るno用
var imgNo; //画像番号
var clno; //画像番号
var climgno; //クリックした画像番号
var misyori; //未処理の数
var seikai; //正解の数
var machigai; //間違いの数
var SAMPLEmita; //サンプルを見た回数
var cnt; //カウントダウン用カウンター
var rnd; //ランダム
var toolNarabe //Tool画像を並べる順番
//イメージの事前読み込み
if(navigator.appVersion.charAt(0)>=3)
{
Ushionimg = new Array();
for(i=0;i<10;i++)
{
Ushionimg[i] = new Image();
Ushionimg[i].src = "USHI"+i+".GIF";
}
}
//スタート関数
function startGame(){
str=1;
ini();
countDwnWin();
setup(9)
SAMPLEDayon();
SAMPLEmita=0;
}
//初期設定
function ini(){
TimeID1 = 0;
TimeID2 = 0;
co = 0;
imgNo = 4;
clno = 4;
misyori = 0;
seikai = 0;
machigai = 0;
SAMPLEmita = 0;
cnt = 20;
rnd = 0;
SAMPLE0 = "0123456789"; //サンプル画像を並べる順番
toolNarabe = '741025836';
//ランダム
rndStr1() ;
//取得したランダム数字によってツールの並べ方を決める
if(rnd=='0')toolNarabe='741025836';
if(rnd=='1')toolNarabe='852641307';
if(rnd=='2')toolNarabe='623587104';
if(rnd=='3')toolNarabe='536124078';
if(rnd=='4')toolNarabe='463102875';
if(rnd=='5')toolNarabe='376852041';
if(rnd=='6')toolNarabe='263587410';
if(rnd=='7')toolNarabe='103456872';
if(rnd=='8')toolNarabe='085762413';
//ツールを並べる
if( document.images )
{
for ( s=0 ; s < 9 ; s++ ){
document.images['tool'+s].src=Ushionimg[toolNarabe.charAt(s)].src;
}
}
}
//カウントダウンウインドウ
function countDwnWin()
{
takuw3 = window.open("","w3","width=50,height=50")
if(takuw3!=null)
if(cnt>0)
{
takuw3.document.write("<font size=7><b>"+cnt+"</b></font><hr>")
takuw3.document.close()
cnt--; //実行するたびにカウントを1マイナスする
TimeID1=setTimeout('countDwnWin()',1000);//1秒ごとにcountDwnWin()を実行
takuw3.focus()
}
else
{
clearTimeout(TimeID1); //タイマー終了
hantei(); //判定
if(takuw3!=null)takuw3.close(); //ウインドウを閉じる
}
}
//うし画像クリック時の処理
function meirei(Ushino)
{
if(navigator.appVersion.charAt(0)>=3)
{
if(str==1){
document.images['Ushi'+Ushino].src= "USHI"+clno+".GIF"
}
}
}
//指定したimgNoの画像で画面を塗りつぶす
function setup(imgNo)
{
if(navigator.appVersion.charAt(0)>=3)
{
for(cl=0;cl<9;cl++){
document.images['Ushi'+cl].src=Ushionimg[imgNo].src
}
}
}
//1桁のランダム(文字)を作る
function rndStr1(){
if(navigator.appVersion.charAt(0)>=3)rnd=Math.random();
rnd=(""+rnd).charAt(2);
return rnd;
}
//Sample画像に書き換える
function SAMPLEDayon()
{
if(document.images && str ){
//現況を記録
imgKeika = new Array();
for (pk=0;pk<9; pk++){ imgKeika[pk]=document.images['Ushi'+pk].src }
//サンプルに書き換え
for (p=0;p<9; p++)
{
document.images['Ushi'+p].src =Ushionimg[SAMPLE0.charAt(p)].src};
// 50/1000秒後に現況へ戻す
TimeID2=setTimeout('for(ps=0;ps<9; ps++){document.images["Ushi"+ps].src =imgKeika[ps]}',50);
SAMPLEmita++; //サンプルを見た回数を1プラスする
}
}
//判定
function hantei()
{
if(navigator.appVersion.charAt(0)>=3)
{
//結果をスキャン
imgKettka = new Array();
for (hank=0;hank<9; hank++)
{ imgKettka[hank] = document.images['Ushi'+hank].src }
//判定開始
for (han=0;han<9; han++)
{
if(imgKettka[han]==Ushionimg[9].src)
{
misyori++; //未処理の数を1プラス
}
else
{
if(imgKettka[han]==Ushionimg[SAMPLE0.charAt(han)].src)
{
document.images['Ushi'+han].src ="USHIMARU.GIF";
seikai++; //正解の数を1プラス
}
else
{
document.images['Ushi'+han].src ="USHIBATSU.GIF"
machigai++;//間違いの数を1プラス
}
}
}
}
//判定結果をalertダイアログで出力
alert("お疲れさま(^^)/っ\n\nA.正解の数="+seikai+"\nB.未処理の数"+misyori+"\nC.間違いの数"+machigai+"\nD.見本を見た回数"+SAMPLEmita+"\n\n結果[A-(B+C+D)]は"+(seikai-(misyori+machigai+SAMPLEmita))+"ポイントです")
str=0;//ゲーム終了フラグ
}
//ツールセット(Toolをクリックした時に画像番号をセットする)
function tlset(climgno){clno=climgno;return}
//-->
</script>
</head>
</body>
<center>
<font size=7 color="orange">う</font>
<font size=7 color="#000000">し</font>
<font size=7 color="red">パ</font>
<font size=7 color="#000000">ズ</font>
<font size=7 color="magenta">ル</font>
<br>
<font size=1>
SAMPLEの模様を覚えてカウント0になる前に再現してね(^^)/.......
</font><p>
<!--うし画像9枚-->
<table border="5" bgcolor="FDADBC" aline=top><tr><td><a href="javascript:meirei(0)"><img border=0 name="Ushi0"
src="USHIBATSU.GIF" width="60" height="60"></a><a href="javascript:meirei(1)"><img border=0 name="Ushi1"
src="USHIBATSU.GIF" width="60" height="60"></a><a href="javascript:meirei(2)"><img border=0 name="Ushi2"
src="USHIBATSU.GIF" width="60" height="60"></a><br><a href="javascript:meirei(3)"><img border=0 name="Ushi3"
src="USHIBATSU.GIF" width="60" height="60"></a><a href="javascript:meirei(4)"><img border=0 name="Ushi4"
src="USHIMARU.GIF" width="60" height="60"></a><a href="javascript:meirei(5)"><img border=0 name="Ushi5"
src="USHIBATSU.GIF" width="60" height="60"></a><br><a href="javascript:meirei(6)"><img border=0 name="Ushi6"
src="USHIBATSU.GIF" width="60" height="60"></a><a href="javascript:meirei(7)"><img border=0 name="Ushi7"
src="USHIBATSU.GIF" width="60" height="60"></a><a href="javascript:meirei(8)"><img border=0 name="Ushi8"
src="USHIBATSU.GIF" width="60" height="60"></a><br></tr></td></table>
<p>
<!--Samplボタン-->
<nobr>
<a href="javascript:void(0)"
onClick="SAMPLEDayon()"
><img src="SAMPLE.GIF" name="SAMPLE" width="50" border=0></a>
<!--Startボタン-->
<a href="javascript:void(0)"
onClick="startGame()"
><img src="START.GIF" width="50" border=0></a><p>
<!--Tools-->
<table border="2" aline=top>
<tr>
<td>
<nobr><font COLOR="red">T</font>ools
<td><a href="javascript:tlset(toolNarabe.charAt(0))">
<img border=0 name="tool0" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(1))">
<img border=0 name="tool1" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(2))">
<img border=0 name="tool2" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(3))">
<img border=0 name="tool3" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(4))">
<img border=0 name="tool4" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(5))">
<img border=0 name="tool5" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(6))">
<img border=0 name="tool6" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(7))">
<img border=0 name="tool7" src="USHI9.GIF" width="24" height="24"></a></td>
<td><a href="javascript:tlset(toolNarabe.charAt(8))">
<img border=0 name="tool8" src="USHI9.GIF" width="24" height="24"></a></td>
</nobr>
</td>
</tr>
</table><p>
<p><font size=1>
SAMPLEの模様を覚えてToolsの断片で再現してください。
<br>Toolsの断片をクリックしてからうえの画面のはりたい場所でもう一度clickします(^^)/
<br>わからなくなったらSAMPLEを押すと一瞬だけ見れます。
<br>ただ、SAMPLEを押した回数分得点はマイナスされます。
</font><hr width=20%>
<br>
<font size=1>Netscape3.0以上用</font><hr width=20%>
</center>
</body>
</html>
使用している画像:
USHI0.GIF
USHI1.GIF
USHI2.GIF
USHI3.GIF
USHI4.GIF
USHI5.GIF
USHI6.GIF
USHI7.GIF
USHI8.GIF
| CONTENTS
| PART1 これだけ知っていれば大丈夫
| PART2 サンプルの紹介
| PART3 JavaScript言語仕様
| PART4 JavaScriptクイック書式一覧
| PART5 JavaScriptサイト
| オンラインサポートページ(回線をつないでください)