- リンクされている各ページのファイルをコードエディタで開き問題をクリアしましょう。
- 最低クリア条件:2問解答
- おおよその難易度順に並んでいますので、上から順にクリアしていくとスムーズです。
- 未回答の問題はリンクを外しておきましょう(テキストは残しリンクを#に変更する)。
- 1.CSSのドロップダウンメニュー
-
test6-1.html
CSSのみでドロップダウンメニューを実装する
- 2.CSSのホバーアニメーション
-
test6-2.html
CSSのみでさまざまなホバーアニメーションを実装する
- 3.slickを利用したカルーセル
-
test6-3.html
slickでカルーセルスライダー(カルーセルバナー)を実装する
- 4.Swiperを利用した無限ループスライダー
-
test6-4.html
Swiperで無限スクロールスライダーを実装する
- 5.スクロールに応じて要素をフェードインさせる
-
test6-5.html
CSSとJavaScript(jQuery等)を利用し、スクロールに応じて要素をフェードインさせるアニメーションを実装する