sample2

Welcome!



×××××'s home page


☆★☆★☆★☆★☆★ ゆっくり見ていってね ☆★☆★☆★☆☆★



・自己紹介

・日記

・リンク

・隠し部屋
(divタグ)

・隠し部屋
(aタグ)






 中級編では、JavaScriptを使ってみましょう。JavaScriptもHTMLと同じく、どのブラウザにも標準装備されているので、気軽に使うといいんじゃないかな。少し重くなって、開くのが遅くなりますが。

 隠しページを作るには、外部ファイルを利用するとよいでしょう。通常JavaScriptはHTMLと一緒に並べて書くのですが、それだと「ソースを見る」ことによりすべてが見られてしまいます。そこで「外部ファイル」という拡張子を.jsにしたファイルを用意して、その中にプログラムを書く方法をとります。そうすると、対象のHTMLファイルには以下の一行を書くだけでよく、ソースとしてプログラムの内容が見られないのです。


<script language="JavaScript" src="example.js"></script>

この例では、example.jsに保存された内容が参照されます。
 ただし、JavaScriptにちょっと知識のある人なら、簡単に仕掛けや移動先URLを見つけることができます。だから完全に隠すことはできません。でも「隠しページがありますよ」みたいなことを書かなければ、誰もJavaScriptの外部ファイルを覗こうとは思わないでしょうから、ひっそりと仕掛ける分には有効です。

2-1. パスワードを入力させる

 JavaScriptはHTMLよりも2.5倍むずかしいので(謎)、細かい説明はしません。とりあえず以下の文をメモ帳にコピー&ペーストして、"----.js"形式で保存して、パスワード入力させたいページのファイルと同じフォルダに入れましょう。


function prom(){
pswd=prompt("パスワードを入力してください","ここに入力");
if(pswd=="ひみつ")location.href="himitu.html";
if(pswd=="secret")location.href="secret.html";
}

そしてクリックによって入力画面を開かせたいなら、その文字や画像を以下のdivやaタグで囲みます。


<div onclick="prom()">・隠し部屋</div>

または


<a href="JavaScript:prom()">・隠し部屋</a>

これで、完了です。上の例では、「・隠し部屋」をクリックすることによってプロンプトが開き、"ひみつ"と入力すると"himitu.html"へ、"secret"と入力すると"secret.html"へ移動します。

 パスワードは自由に設定できます。また、いくらでも数を増やすことができるので、番号選択型の目次のふりをして隠しページの入り口にするなどすれば、なかなか面白いと思います。

 リンク文字の設定の仕方は、上のようにdivタグとaタグの二種類があります。"divタグ"による方法では、[Tab]キーを押してもリンク場所がマーキングされないという特徴があり、とことん隠す場合にはもってこいです。しかし古いネットスケープではonclickは動作しません。つまりネットスケープによって見ている人が"divタグ"による方法で指定されたリンク文字をクリックしても
「ウンともスンともいわないよ?」
という事態が起こります。一般に公開するなら、ネスケ派の人のことも考えてa href〜で設定すべきだと思いますよ。
 ちなみに上記のonclickの部分をondblclickにすると、ダブルクリックで開くようになります。

 あと、くどいようですが、外部ファイルを覗かれたら一発でバレることも頭に入れといてください。

2-2. 時間差攻撃

 昔『たけしの挑戦状』というクソゲーがありましたが、その中に「白紙の手紙を開いて、一時間そのままの画面で待っていると、文字が浮き出てくる」というえげつない謎解きがありました。原理的にはそれと一緒です。


function timeSpan(){
setTimeout("location.href='himitu.html'",15000)
}

外部ファイルに上の文をコピペして、


<a href="JavaScript:timeSpan()"></a>

クリックによりジャンプさせる文字をタグで囲みます。この例では、のクリックのあと、15000ミリ秒(15秒)後に、himitu.htmlに移動します。使用時はこの値や移動先を適宜変えてください。

 また、bodyタグに以下の要素を入れると、ページが開かれてから15秒後に移動させることができます。


<body onLoad="timeSpan()">

 じっくりと時間をかけてホームページを読んでくれている人にだけ、秘密のページへの扉が開かれます。多少イジワルな気もしますが。

2-3. キーボードを打つと・・・。

 はじめに実用例を示しましょう。キーボードで"secret"と打ってみて下さい。

 次に"himitu"と打ってみて下さい。

 どうでしょうか。設定するには外部ファイルに以下を貼り付けてください。


a=0; 
keyWord01=new Array("H","I","M","I","T","U");
b=0; 
keyWord02=new Array("S","E","C","R","E","T");

function keyType()
{
keyGet=String.fromCharCode(event.keyCode);
	if(keyGet==keyWord01[a] && a<=(keyWord01.length-1))
	{
	a++;
	}
		else
		{
		a=0;
		}
	if(keyGet==keyWord02[b] && b<=(keyWord02.length-1))
	{
	b++;
	}
		else
		{
		b=0;
		}
kResponse();
}

window.document.onkeydown=keyType

function kResponse()
{
	if(a==keyWord01.length)
	{
	window.open("himitu01.html","himitu","");
	a=0;
	}

	if(b==keyWord02.length)
	{
	window.location.href="secret.html";
	b=0;
	}
}

 ちょっと長いですね。パスワードを増やすときは、「01,02,…」「a,b,…」に関して、同じパターンを繰り返してください。

 あ、これはネットスケープじゃ動きませんのであしからず。



応用編>>
<<もどる




SEO [PR] 爆速!無料ブログ 無料ホームページ開設 無料ライブ放送