イベントを覚えよう

Tzalik

License: MIT License

Fork
0
Fav
0
View
66
  • Play

Fullscreen

Smart Phone

  • Readme
  • JavaScript 3 lines
  • HTML 0 lines
  • CSS 10 lines
  1. onclick を使おう
    => <button> タグの onclick 属性で console.log を実行
  2. onchange を使おう
    => <input type="text"> や <input type="checkbox"> タグの onchange 属性で console.log を実行
  3. onfocus を使おう
    => <input type="text"> タグの onfocus 属性で背景色を変更
  4. onmouseover を使おう
    => div タグの onmouseover 属性で任意の style を変更
  5. onkeyup を使おう
    => <input type="text"> タグの onkeyup 属性で入力された文字を console.log で出力
  6. click イベントを登録しよう
    => <button> タグに click イベントを登録して console.log を実行
  7. change イベントを登録しよう
    => <input type="text"> や <input type="checkbox"> タグに change イベントを登録して console.log を実行
  8. focus イベントを登録しよう
    => <input type="text"> タグに focus イベントを登録して背景色を変更
  9. mouseover イベントを登録しよう
    => div タグに mouseover イベントを登録して任意の style を変更
  10. keyup イベントを登録しよう
    => <input type="text"> タグに keyup イベントを登録して入力された文字を console.log で出力
  11. resize を使おう
    => window に resize イベントを登録して window の縦横幅を console.log で出力
  12. scroll を使おう
    => window に scroll イベントを登録して window の縦スクロール位置を console.log で出力
  13. mousemove を使おう
    => div タグに mousemove イベントを登録してマウス位置を console.log で出力

できればネイティブで。

  • イベントを覚えよう
  • イベントを覚えよう

play

Complete!

Description What kind of game?

Control Device

jsdo.it websocket controller

Mouse

keyboard

smartphone

Fullscreen

Tzalik

Author

Default Panel

Size

  • Width: px
  • Height: px

code

QR Code

Discussion

Questions on this code?