【2020/12/18】大学生がプログラミング独学 jQueryとSass【記録】
2020/12/18
- jQuery標準デザイン講座 Lesson14-20 2週目 （アウトプット）
- Sassの教科書 第1章、第2章
jQuery標準デザイン講座
Lesson14 要素の高さを揃える
- 各要素の高さを取得・比較し、高さの最大値を取得する【each() / height() / if文】
- 取得した最大値を全ての要素の高さに適用する【css("height", 最大値 + "px")】
Lesson15 文字サイズの変更
- ボタンで文字サイズを選択する【click()】
- 文字サイズを変更する【html() / addClass() / removeClass() / if文】
Lesson16 パララックス効果
- ボタンをクリックしてコンテンツを選択する【click() / html()】
- コンテンツ移動（ずらす）【animate()】
- 背景画像の移動（ずらす）【css()】
- 選択されているボタンのスタイルを変更する【removeClass() / addClass()】
Lesson17 フィルタリング
- フィルタリングの条件を特定する【click() / attr()】
- 一旦すべて非表示にする【each() / animate() / hide()】
- 条件を満たすのみ再表示する【each() / animate() / hasClass() / show()】
Lesson18 テーブルセルのハイライト
- セルにマウスオーバーする【hover()】
- 同行のセルスタイルを変更する【parent() / addClass()】
- 同列のセルスタイルを変更する【index() / :nth-child() / addClass()】
- マウスアウトでスタイルをもとに戻す【removeClass()】
Lesson19 アコーディオンパネル
- 一番目のコンテンツ以外を伸縮させて非表示にする【css()】
- タイトルを選択する【click()】
- 選択されたコンテンツを展開する【attr() / animate() / hasClass() / if文】
Lesson20 スムーススクロール
- ナビゲーションの選択【click()】
- 選択したコンテンツへ移動する【attr() / offset() / animate()】
Sassの教科書
Sassとは？ってとこから
Sassの背景などについて勉強しました。
Sassでコードを書き始めるには以下の4つ、
が必要。
<ではまた、Salut!!>
プログラミング学習の経過・全容はこちらにまとめてあります！
興味がありましたら、チェックしてみてください（＾＾）
教材
jQuery
Sass
