JavaScriptでストップウォッチを作ろう (全13回)
JavaScriptでシンプルなストップウォッチを作る方法を学んでいきます。
このレッスンでは HTML5 / CSS / CSS3 / JavaScript を使用しています。
-
#01 ストップウォッチを作ろう (02:51)
- 完成版の確認
- index.htmlの作成
- styles.cssの作成
- main.jsの作成
-
#02 画面のマークアップをしていこう (02:24)
- htmlのマークアップ
- 要素の取得
-
#03 カウントアップ機能を実装しよう (02:50)
- カウントアップ機能の実装
-
#04 タイマーを表示させよう (02:58)
- タイマーの表示
-
#05 表示桁数を固定しよう (02:18)
- 表示桁数の固定
-
#06 停止､リセット機能を実装しよう (02:19)
- 停止機能の実装
- リセット機能の実装
-
#07 再開の仕組みを理解しよう (02:39)
- タイマー再開の仕組みについて
-
#08 タイマーが再開できるようにしよう (01:31)
- 再開機能の実装
-
#09 ストップウォッチを仕上げていこう (02:49)
- 不具合の修正
-
#10 全体のスタイルを整えよう (02:54)
- 画面のスタイリング
-
#11 ボタンのスタイルを整えよう (02:56)
- ボタンのスタイリング
-
#12 ボタンのスタイルを付け替えよう (02:53)
- ボタンのスタイルの付け替え
-
#13 スタイルを付け替える関数を作ろう (02:47)
- スタイルを付け替える関数の作成
