このページを日本語で閲覧するには「続ける」を押してください。
Press "Continue" to see this page in English.
料金プランを有効化して学習を始めましょう。

スクロール時のナブバー表示・非表示

スクロールに反応するナビバー・インタラクションを構築する。

アクセス制限

レッスン動画を閲覧するには、会員登録が必要です

レッスン動画を閲覧するには、会員登録と有料プランの加入が必要です

アクセス制限

レッスン動画を閲覧するには、有料プランの加入が必要です。

レッスン内容

ナビゲーションバーを非表示にする

  1. ナビゲーションバーを選択し、その位置がビューポートに対して固定されていることを確認します
  2. インタラクションパネルで、When Scrolled Down を Start an Animationメニューから選択します
  3. 名前を付けます(例: "nav leave")
  4. タイムアクションの横にあるプラス記号をクリックします
  5. Move(移動)の下で、Y軸を調整して、ナビゲーションバーがビューポートの外側に配置されるようにします
  6. イージングカーブと所要時間を調整します

ナビゲーションバーを再表示する

  1. ナビゲーションバーを選択します
  2. インタラクションパネルで、Start an AnimationをWhen Scrolled Upメニューから選択します
  3. 名前を付けます(例: "nav enter")
  4. タイムアクションの横にあるプラス記号をクリックします
  5. Move(移動)の下で、Y軸を0に戻します
  6. イージングカーブと所要時間を調整します

プレビューで作業内容を確認してください。

コースのレッスン

No items found.

学習進捗

閲覧後に「完了」を押して、進捗を保存しましょう