【figma】背景が固定のパララックス

背景が固定で、全画面表示、その他の要素(文字とか)がスクロールできる、といったWEBサイトがよくありますが、
簡単にFigmaで再現する方法をまとめましたので、ご活用ください!

こんな感じです↓↓↓

背景を固定させる

固定させたい部分を固定させます
[プロトタイプ]>[スクロールの操作]>[追従(上端で停止)]

画像以外にも一緒に固定させいたいものがある場合はグループにして固定する。

スクロールできる要素を作成する

スクロールができる高さを取って作成します。
この時、レイヤーの順を画像のようにしてください。


※テキストグループの背景色はわかりやすいように色をつけていますが、プレビュー時に透明度100%にしてください。

これで、完成のイメージのようになります!

かんたん!

  • URLをコピーしました!
目次