242 件のレッスンと 618 件のレッスン動画が見つかりました。

#04 画像を領域内に収めよう PREMIUM

JavaScriptでカルーセルを作ろう
画像がカルーセルの領域に収まるように修正していきます。

#05 画像を横並びにしてみよう PREMIUM

JavaScriptでカルーセルを作ろう
object-fitプロパティを使って画像の縦横比が保たれるようにしていきます。

#06 ボタンを配置してみよう PREMIUM

JavaScriptでカルーセルを作ろう
画像をスライドさせるためのボタンを配置していきます。

#07 ボタンのスタイルを整えよう PREMIUM

JavaScriptでカルーセルを作ろう
ボタンの見た目を整えたのち、画像の領域に対してボタンを上下中央揃えにしていきます。

#09 画像を動かしてみよう PREMIUM

JavaScriptでカルーセルを作ろう
ボタンをクリックしたら次の画像にスライドするようにイベントを設定していきます。

#10 画像の幅を取得してみよう PREMIUM

JavaScriptでカルーセルを作ろう
画像が1枚分だけ横にスライドするように修正していきます。

#11 画像を移動させる距離を計算しよう PREMIUM

JavaScriptでカルーセルを作ろう
何番目のスライドを表示したいかを変数で管理していきます。

#12 戻るボタンを動作させよう PREMIUM

JavaScriptでカルーセルを作ろう
ボタンをクリックしたら前の画像にスライドするようにイベントを設定していきます。

#13 ボタンの状態を更新しよう PREMIUM

JavaScriptでカルーセルを作ろう
ボタンの状態を更新することで、不具合を直していきます。

#14 ボタンの動作を確認しよう PREMIUM

JavaScriptでカルーセルを作ろう
updateButtons()メソッドを呼び出し、ボタンの状態が更新されるか確認していきます。