JavaScript– category –
-
アニメーションを付ける
クリックしたときに、「+」マークと内容の表示がアニメーションするようにしていきます。 +から× 回答のアニメーション アニメーションプロパティ +から× ・前回までで... -
ひとつ開いたら他のタブは閉じる仕様にする
ひとつの項目を開くと他の項目が閉じられるように実装していきます。 dt要素の調査 クラスの削除 dt要素の調査 ・前回まででアニメーションを付けてより快適なUIを作っ... -
タブメニューの作り方
JavaScriptを使ってタブメニューを作っていきます。 全体像の確認 ファイルの作成 全体像の確認 ・まずタブメニューについてですがタブメニューとはタブ形状のメニュー... -
その他のファイルの読み込み
CSSファイルとJavaScriptをファイルを読み込んで行きます CSSファイル JavaScriptファイル CSSファイル ・前回まででタブメニューを作るための全体像の把握とHTMLファイ... -
メニューのスタイリングとクラスの追加
activeクラスがついているメニューにスタイルをつけていきます。 メニューのスタイリング コンテンツのスタイリング displayプロパティの操作 メニューのスタイリング ... -
擬似クラス
細かい部分のスタイルを調整とホバー擬似クラスをつけていきます。 細かいスタイリング 擬似クラス 細かいスタイリング ・前回activeクラスをつけてそちらのスタイルを... -
JavaScriptでメニューにイベントをつけていく
メニューのliにclickイベントを設定して、クリックされたらactiveクラスが追加されるようにしていきます。 イベントの設定 ページ遷移のキャンセル イベントの設定 ・前... -
クラスの付け替え
activeクラスを追加する前に、元からついていたactiveクラスは外すことで、移動するようにします。 activeクラスの付け替え activeクラスの付け替え ・前回まででクリッ... -
タブの内容を切り替える
内容を切り替えるための処理として、まず全てのcontentからactiveクラスを削除します。 コンテンツからクラスを削除 コンテンツからクラスを削除 ・前回まででメニュー... -
カルーセルの作り方
JavaScriptでWEBサイトでよく見る横に画像などをスライドさせるカルーセルの作り方 完成版の確認 開発環境の確認 ファイルの作成 完成版の確認 ・今回からはJavaScript...
