プログラムな日常
>
ウェブプログラム作品集
>
自作ボタン javascript 版
(customized buttons in javascript)
本来のボタン(離した時機能)
0
自作のボタン
fabricated button
自作ボタン圧されている:
押した時機能
0
押した時と、連続動作
0
離した時機能
0
自作の方向指定ボタン(押した時と、連続動作)
(0, 0)
自作ボタンC#版
の javascript 版です(2/4 微修正)。
C# のときは Panel を材料にしましたが、今度は div を材料にし、ボタンを別々に作るのではなく、1つのボタンに3種のイベントを組み込みました。
といっても、基本的な click のイベント(離した時機能)は div にもともと備わっていました。 これは、'click' 名の dispatchEvent 即ち送信側を設定したところ、2ずつカウントアップする (addEventListener で作った受信側が本来のイベント配信と作り付けとの両方を受けてしまう)ことで気付きました。 あとは、マウスポインタを翳したり、プレスしたときのボタンの見え方を再現してみました。
【html(部分)】
【javascript ソースコード】
002.js(ボタンのデモ):
buttons.cs(ボタン自体のコード):