もう１人の自分占い



あなたの誕生日から、あなたの中に潜む「もう１人の自分」を占います。
もう１人の自分は、１日ごとに、あなたの中で生まれ変わると言われています・・・

上の占いは、以下のサンプルを使った例です。

このページでは、サーバを使わない占いサイトの作り方の例を示します。占いのサイトを作りたいけど、サーバの準備が難しい方（イベント系の仕事でよくあることですが・・・）のお役に立てれば幸いです。

※JavaScript でウェブページを動的に変化させる例になっています。



準備

準備するものは、以下の２つのファイルです。２つとも同じフォルダに保存してください。

（IE の例：　右クリックで「対象をファイルに保存」で保存できます。）

・uranai-sample.html
・uranai-sample.js

ダウンロードしおわりましたら、一度、PC上で uranai-sample.html をクリックして動作確認をしてみてください。

以下では、検索結果や表示方法の変更の仕方を説明します。

検索結果の内容の書き換え方

uranai-sample.js

をメモ帳などのテキストエディタで開き、検索結果の内容を書き換えます（詳しくはファイルの中身をごらんください） 。 誕生日によって、現在、結果が変わるようになっています。




検索結果の表示の書き換え方


urana-sample.html　も同様にテキストエディタで開き、以下の箇所を編集します。

// 検索結果部分のHTMLは以下を編集します。
result.innerHTML= '<table border=0 bgcolor=#000000<tr><td cellspacing=1 bgcolor=#ffffff>'+
'<table border=0><tr><td cellspacing=5><font color=#000000><b>'+
namae+' さん</b></font>の中に潜むもう１人の自分は・・・<br><br>'+
'<b><font color=#000000 size=+2>'+
getTitle(number)+
'</font></b>です。<br><br>'+
getContent(number)+
'</td></tr></table>'+
'</td></tr></table>';

上記の部分に書いたHTMLが、urana-sample.html　の中の


< div id="result">ここ結果が出ます！</div>


の部分とそのまま置き換わって表示されます。