サイコロ２ 📖

CSSで角丸サイコロを作る

プログラム: (→大)
DOM親要素に「<table id="dice"> <tr><td id="eye0"></td><td id="eye1"></td><td id="eye2"></td></tr> <tr><td id="eye3"></td><td id="eye4"></td><td id="eye5"></td></tr> <tr><td id="eye6"></td><td id="eye7"></td><td id="eye8"></td></tr> </table>」をHTML設定。 目＝13。 「#dice」に{ 　"border-collapse":"separate",//隣接するセルのボーダーを重ねない 　"border-spacing":"2px",//セルのボーダーの間隔 　"ボーダー":"solid 3px {黒色}", 　"余白":"{目/2}px", 　"border-radius":"{目/2}px"//角丸 }をDOMスタイル一括設定。 ９回 　「#eye{回数-1}」に{ 　　"幅":"{目}px","高さ":"{目}px", 　　"line-height":"{目}px",//行高さ 　　"ボーダー":"なし", 　　"余白":"0px", 　　"背景色":白色, 　　"border-radius":"{目/2}px"//角丸 　}をDOMスタイル一括設定。 ここまで。 C=0 0.1秒タイマー開始した時には(T) 　((６の乱数)+1)のサイコロ表示。 　C=C+1。 　もし、C=8ならば、Tのタイマー停止。 ここまで。 目位置＝[[4],[0,8],[0,4,8],[0,2,6,8],[0,2,4,6,8],[0,2,3,5,6,8]] ●（数の）サイコロ表示 　９回 　　「#eye{回数-1}」の「背景色」に白色をDOMスタイル設定。 　ここまで。 　もし、数が１ならば、目色は赤色。 　違えば、目色は黒色。 　(数)回 　　「#eye{目位置[数-1][回数-1]}」の「背景色」に目色をDOMスタイル設定。 　ここまで。 ここまで。