ページ内に比較的簡単に設置出来る六面ダイスです。ダイスの横のボタンをクリックするとダイスを振ることが出来ます。IE6、NN7で動作を確認しました。使い道は……ないよなあ。なんかいい使い道を見つけたら、好きに使ってください。
| JavaScriptがOFFになっているか、ブラウザが対応していません。 | JavaScriptがOFFになっているか、ブラウザが対応していません。 | JavaScriptがOFFになっているか、ブラウザが対応していません。 |
標準のボタン以外からダイスロールを行うことも出来ます。
1d6 2d6 3d6 （← クリック）
標準のボタンを非表示にすることも出来ます。
ダイスロール （← クリック）
JavaScriptがOFFになっているか、ブラウザが対応していません。
下記のファイルをDLして拡張子を「js」に変更し、設置したいHTMLファイルと同じディレクトリに置いてください。文字コードはSJISです。外部JSファイルを利用する際には、HTMLファイルと文字コードと合わせる必要がありますので、HTMLファイルをEUCで記述しているなどという場合には、適宜変換してお使いください。
diceRoll.txt
あとは以下のような感じでテキトーに記述してください。1d6と2d6のダイスを表示させる一例です。
|
<html> <head> <meta http-equiv="content-script-type" content="text/javascript"> <!-- 「diceRoll.js」を外部ファイルとして読み込む --> <script type="text/javascript" src="diceRoll.js"></script> </head> <body> <!-- ダイス書き出し用の要素 --> <p id="dice"> JavaScriptがOFFになっているか、ブラウザが対応していません。 </p> <p id="dice2"> JavaScriptがOFFになっているか、ブラウザが対応していません。 </p> <!-- ダイスのセット --> <script type="text/javascript"><!-- diceView = new Array(); diceView['dice_click'] = new DiceView('dice'); diceView['dice2_click'] = new DiceView('dice2', 2); //--> </script> </body> </html> |
ダイス書き出し用の要素は、divでもspanでもなんでもいいですが、必ずそのページ内でユニークなidをつけてください。同じidが複数あると、まともに動作しません。
ダイスのセットをする際には、まず「diceView」（固定）という名前の配列を作り、ダイスをセットしたい要素のidを引数として「DiceView」クラスのインスタンスを生成し、それを、先のidに「_click」という文字列を付加した文字列を添え字とした配列「diceView」に格納します。うん、自分で書いてて何言ってんだかわかんなくなってきた。
要するに、ダイスをセットしたい要素のidを「setId」とすると、
インスタンス生成時の引数によって、ダイスの数を増やしたり（2d6、3d6など）、ダイスのサイズや色を変更することが出来ます。設置要素のid以外は省略可能です。
| 引数 = (設置要素のid, ダイスの数, 標準ボタン表示（0:なし 1:あり）, ダイスの回転速度（小さいほど速い）, ダイスの転がる時間（カウント数）, ダイス目の記号, ダイス目のサイズ（pt）, ダイスの左右の余白（pt）, ダイスの背景色, ダイスの枠線の色, ダイスの目の色, ダイスの1の目の色, ボタンの文字サイズ（pt）, ダイスとボタンの間の幅（pt）, ボタンの背景色, ボタンの枠線の色, ボタンの文字の色) |
id以外の引数を省略した場合のデフォルト設定及び、上の方にあるカラフルな3d6ダイスを生成する際の引数は、以下の通りです。
標準のボタン以外からダイスロールを行う際には、関数「diceRoll()」を呼び出します。引数には、「setId_click」という文字列を指定してください（「setId」はダイスをセットした要素のid）。
例えば以下のように記述しておけば、「ダイスロール」という文字をクリックしたときにダイスロールが行われます。
ただ単にダイスを設置するのではなく、他のスクリプトと連動して用いるためには、ダイスロールを行った際の最終的なダイス目の値が必要になるかと思います。その値は、各インスタンスの属性「dice（配列）」に格納されています。ダイスロール終了後に何らかのアクションを起こす場合には、関数「diceRollView2」内の「ダイスロール終了」とコメントした部分を利用してください。
っつうか、完全に自分用の覚え書きだよなあ、コレ。まあいいや。
もしトチ狂って、これを使いたいんだけど使い方がよくわからないよトニー、という人は掲示板にでも書いたってください。メールでもいいけど。