ドットインストール - 3分動画でマスターできるプログラミング学習サービス
レッスン一覧
プレミアム会員
法人でのご利用
レッスン一覧
プレミアム会員
法人でのご利用
ログイン
運営からのお知らせ
2023/12/07
NEW
【週刊ドットインストール】 レッスン制作の進捗、代表のひとりごと
PREMIUM
【旧版】JavaScriptでスライドショーを作ろう
JavaScriptを使ってスライドショーを作ります。基本的なナビゲーションの他、自動再生機能も実装していきます。
0%
新しいレッスンがあります
旧版のレッスンは更新を終了しており、現状と異なる場合があります。サポートも終了しておりますので、最新版への移行をお願いします。
PREMIUM
JavaScriptでスライドショーを作ろう
シンプルなスライドショーを作りながら、JavaScriptの実践的な書き方について学んでいきます。
0%
動画レッスン一覧
(18)
未完了
#01 スライドショーを作ってみよう
(02:42)
無料公開中
概要
完成版の確認
必要となる知識
対応ブラウザ
作業用フォルダの説明
未完了
#02 おおまかにマークアップしよう
(02:25)
無料公開中
index.html
未完了
#03 サムネイルを横並びにしよう
(02:44)
無料公開中
styles.cssの作成
未完了
#04 マウスに反応させよう
(02:13)
無料公開中
スタイルの設定
未完了
#05 FontAwesomeを導入しよう
(02:53)
FontAwesomeの導入
未完了
#06 前へ、次へボタンを作ろう
(02:21)
ボタンの配置
未完了
#07 再生ボタンを作ろう
(02:58)
再生ボタンのマークアップ
未完了
#08 main.jsを作っていこう
(02:23)
main.jsの作成
画像ファイルの配列
未完了
#09 前へ、次へボタンを動作させよう
(02:59)
イベントの設定
未完了
#10 メインの画像を切り替えよう
(02:37)
画像の表示
未完了
#11 画像リストを生成しよう
(02:58)
画像リストの生成
未完了
#12 liにクリックイベントを設定しよう
(01:57)
クリックイベントの設定
未完了
#13 currentクラスを移動させよう
(02:39)
クラスの付け替え
未完了
#14 currentNumを更新しよう
(02:35)
currentNumの更新
カスタムデータ属性の利用
未完了
#15 自動再生機能を実装しよう
(02:31)
自動再生機能の実装
未完了
#16 一時停止ボタンを実装していこう
(02:27)
一時停止ボタンのマークアップ
clearTimeout()
未完了
#17 ボタンの表示/非表示を切り替えよう
(02:02)
ボタンの表示/非表示
未完了
#18 リファクタリングをしよう
(02:51)
リファクタリング
リリース情報(note)
記事はありません。
関連キーワード
基礎講座
(386)
初心者向け
(379)
HTML
(116)
CSS
(118)
JavaScript
(6)
ミニプログラム
(143)
詳細情報
最終更新日
2017年2月8日
バージョン情報
HTML5 / CSS / CSS3 / JavaScript