-
デイトラWeb制作コース中級編 DAY28 Q and Aをアコーディオンでコーディング①
ボタンをクリックすると、ビヨーンとテキストが出てくるアレですね。よくQandA(FAQ)に使われています。下準備として、プラスとマイナスのアイコン画像をカンプからDL⇨imgフォルダに入れておきます。 【Q and Aをアコーディオンでコーディングqa編 jQuery】... -
デイトラWeb制作コース中級編 DAY27 ページ内リンクでクリックした要素に下線を引く(クリックイベントの処理)②
今回はタブをクリックで切り替わるパネルを作ります。一昔前はAjaxと呼ばれ流行しましたね。 【クリックイベントの処理 tab編 jQuery】 jQueryは結構簡単で、今までの応用で出来ます。前回のjQueryの大枠の中に入れ子で書きます。 // クリック（タブ） jQu... -
デイトラWeb制作コース中級編 DAY27 ページ内リンクでクリックした要素に下線を引く(クリックイベントの処理)①
【ページ内リンクでクリックした要素に下線を引く(クリックイベントの処理) jQuery】 とても分かりやすいコードのため今回はコードをそのまま貼ります。前回のコードの親要素の中に書きます。 実は、アクションイベントの多くは「◯◯したら□□のクラスをつけ... -
デイトラWeb制作コース中級編 DAY26 スムーススクロールとフローティングアイテムを作る
【スムーススクロールとフローティングアイテムを作る jQuery】 jQueryの読み込みにはCDNを利用しました。コードは回答例に倣っています。今回もコードを色分けしましたのでご参考に。間違っている箇所がありましたらコメントで教えていただければ幸いです... -
デイトラWeb制作コース中級編DAY25 スマホ時のドロワーメニューを作る②
【ドロワーのコーディングcover編 jQuery】 ※厳密には今回作るメニューはドロワーではないですが、便宜上ドロワーと呼びます 前回と全く同じコードなので、ひとつ前の記事をご覧ください。 https://nagimio.com/drawer/ 【ドロワーのコーディングcover編 H... -
デイトラWeb制作コース中級編DAY25 スマホ時のドロワーメニューを作る①
色んな作り方がありますが、私はデイトラの回答例の方法で作りました。各種ライブラリを使用する方法については以下のページをご覧ください。 https://haniwaman.com/drawer-js/ https://haniwaman.com/hiraku-js/ 自作する場合はこちら。 https://mdstage... -
デイトラWeb制作コース中級編DAY24 スクロールに応じて要素を「フワッ」と登場させる
基本ははにわまんさんの記事をどうぞ。 https://haniwaman.com/wow/ WordPress上で使用するにあたっては以下のページを参考にしました。 https://a-m-t.co.jp/wow-js/ サンプル bounce pulse shake swing wobble bounceIn bounceInLeft bounceInUp bounceO... -
デイトラWeb制作コース中級編DAY23 スライダー(カルーセル)を作る②
下準備として、カンプからアローアイコンの画像をpngでダウンロードし、リネームしてimgフォルダに入れておきます。 【スライダーのコーディングmultiple編 jQuery】 私はCDNを利用しました。 CDNのCSSをhead内に、JSをbodyの終了タグの直前にコピペします... -
デイトラWeb制作コース中級編DAY23 スライダー(カルーセル)を作る①
下準備として、カンプからアローアイコンの画像をpngでダウンロードし、リネームしてimgフォルダに入れておきます。 【スライダーのコーディングslider編 jQuery】 私はCDNを利用しました。 CDNのCSSをhead内に、JSをbodyの終了タグの直前にコピペします。... -
デイトラWeb制作コース中級編DAY22 コーディング後の品質を担保するテスト②
【チェック項目一覧】 2つ目はデイトラの課題です。 チェック項目ははにわまんさんのこの記事とほぼ一緒です。 https://haniwaman.com/coding-test/ 1、誤字脱字がないか difffで各テキストをチェックします。特に文章という文章がないですが一応確認。ク...
