SP、ヘッダーナビゲーションの作成 - Githubissues

saki-llc / self-introduction

0 stars 0 forks source link

SP、ヘッダーナビゲーションの作成 #16

Open fujisakiwahei opened 5 hours ago

fujisakiwahei commented 5 hours ago

概要

スマホサイズのヘッダーナビゲーションとハンバーガーメニュー、それに伴うアニメーションと表示切り替えを実装する。

タスク

[x] ナビゲーションの実装
[x] ハンバーガーボタンの実装
[x] 表示切り替えのjs作成

完了条件

メモ

fujisakiwahei commented 5 hours ago

表示切り替え

ハンバーガーボタンとナビゲーションを変数に
ハンバーガーボタンをクリックしたら
クラスをtoggle

fujisakiwahei commented 4 hours ago

[x] ナビゲーションが開いている時はスクロールを無効にする。

fujisakiwahei commented 4 hours ago

ナビゲーションをクリックしたときに、各セクションへスクロールする

ナビゲーションをクリック時
クリックした要素の、data-targetを変数に入れる。
変数の、トップからの距離を取得
ナビゲーションとハンバーガーボタンをクラスtoggle
0.5秒遅れで、取得した距離まで、ページをスクロール