ドットインストール - 3分動画でマスターできるプログラミング学習サービス

PREMIUM

【旧版】JavaScriptでスライドショーを作ろう

JavaScriptで簡単なスライドショーを作る方法を学んでいきます。
0%
新しいレッスンがあります
旧版のレッスンは更新を終了しており、現状と異なる場合があります。サポートも終了しておりますので、最新版への移行をお願いします。
PREMIUM
JavaScriptでスライドショーを作ろう
シンプルなスライドショーを作りながら、JavaScriptの実践的な書き方について学んでいきます。
0%
#02 画面のマークアップをしよう
画像が表示されません
2022年1月27日
#03 全体のスタイルを整えよう
widthを設定すれば、heightを設定しなくてもよいのではないでしょうか？
2022年1月27日
子要素のスタイリングに > を使う場合と使わない場合の違いはなんですか？
2022年1月27日
#06 サムネイルのスタイルを整えよう
grid ではなく flexbox を使っても問題ありませんか？
2022年8月23日
current クラスが認識されません
2022年1月27日
.currentでopacityが適用されないのはなぜですか？
2022年1月27日
liとcurrentの間にスペースがあったりなかったりするのはなぜですか？
2022年1月27日
#07 JavaScriptでメイン画像を表示しよう
indexをどのように解釈すれば良いか教えて下さい
2022年1月27日
mainImage.srcの「.」はどういう意味ですか？
2022年1月27日
#08 サムネイルを表示しよう
img.src = image; の意味を教えてください
2022年8月23日
複数の要素には同じイベントを設定できますか？
2022年1月27日
imgとliの宣言はforEachの外でしてもいいのではないでしょうか？
2022年1月27日
#09 メインの画像を切り替えよう
li 要素に current クラスをつける処理が理解できません
2022年3月24日
mainImage.src = image を images[index] としても良いのですか？
2022年3月24日
appendChild(img) の前に if 文で li.classList.add('current'); をいれるのはどうしてでしょうか？
2022年1月27日
li ではなく img に addEventListener をつけてもよいですか？
2022年1月27日
「どのサムネイルをクリックしたか」はどのように認識しているのですか？
2022年1月27日
li.classList.add(".thumbnails li.current") とすべきではないですか？
2022年1月27日
サムネイルをクリックしたときの処理が理解できません
2022年1月27日
forEachのコールバック関数について教えて下さい
2022年1月27日
currentIndexはどこで更新されるのですか？
2022年1月27日
クリック時の処理がどの流れで実行されるかイメージがつかめません
2022年1月27日
#10 currentクラスを移動させよう
thumbnails>li[5] を押した場合、 currentIndex に 5 が代入されるという理解であっていますか？
2022年2月28日
クリックイベントで li.classList.add('current'); としても問題ありませんか？
2022年1月27日
current クラスを付けているコードについて教えて下さい
2022年1月27日
「.thumbnails > li」の「>」は何ですか？
2022年1月27日
thumbnailsを宣言する位置を変えてみたのですがエラーが出ます
2022年1月27日
forEachの中でaddEventListenerを書かないといけないのはなぜですか？
2022年1月27日
index、currentIndexについて理解したい
2022年1月27日
currentクラスが外れる処理がよくわからない
2022年1月27日
forEachの処理内のli.addEventListenerがどう動くか説明してほしい
2022年1月27日
#11 ｢次へ｣ボタンを動作させよう
querySelectorAll('.thumbnails > li')[target].click(); の別の書き方を教えてください
2022年1月27日
= と === は同じものではないのですか？
2022年1月27日
click()の仕組みが理解できずにいます
2022年1月27日
next.addEventListener の実装について教えて下さい
2022年1月27日
「次へ」ボタンはなぜJavaScriptで生成しないのですか？
2022年1月27日
querySelectorとgetElementByIdはquerySelectorで書いてもいいですか？
2022年1月27日
click()した時のimage, indexについて理解したい
2022年1月27日
targetがなにかわからない
2022年1月27日
なぜtargetにいったん代入するのですか？
2022年1月27日
click()だけでイベントが発生する理由について知りたい
2022年1月27日
「currentIndex++」と書いてはだめですか？
2022年1月27日
#12 ｢前へ｣とPlayボタンを動作させよう
next.click() は他のイベントにも対応していますか？
2022年1月27日
前へボタンの実装に関する条件（target）について教えてください
2022年1月27日
playSlideshowの中身はどうなっていますか？
2022年1月27日
setTImeoutの中身をアロー関数にするのはなぜですか？
2022年1月27日
playボタンのコードを書き換えたらエラーになりました
2022年1月27日
setTimeoutでなぜ繰り返しができたのでしょうか？
2022年1月27日
なぜ最後が「images.length - 1」になるかわかりません
2022年1月27日
#13 Pauseボタンを動作させよう
timeoutId を playSlideShow() 関数内で宣言するとエラーになります
2022年3月24日
timeoutId の宣言を関数 playSlideshow() の中でしたらうまく機能しないのは何故ですか？
2022年1月27日
否定演算子は書き換えてもいいですか？
2022年1月27日
変数宣言はいろいろな場所でしてもいいのですか？
2022年1月27日
isPlaying = !isPlayingがわからない
2022年1月27日

サービスメニュー

ご利用にあたって

プログラミング勉強会

ソーシャルメディア

更新情報

Copyright © 2011-2024 dotinstall.com. All Rights Reserved.