Gallery
レスポンシブ対応
パララックス
Google Maps埋め込み
モーダルウィンドウ
お問い合わせフォーム(送信ボタンの有効化) ※送信不可
めくれて登場するフッター
サイトに動きをつけるためパララックスを実装し、奥行きを感じられるようにしました。セクションの高さが限られているため、今回は背景固定によるパララックスを採用しています。背景が遅れてスクロールするタイプの実装にも対応可能です。
お問い合わせフォームでは、必須項目の入力が完了すると送信ボタンが有効化される仕様にしています。送信後にエラーが表示されるストレスを軽減することを目的としています。
メニューのPC表示は上部に1つ、下部に2つ並び、SP表示では縦に3つ並びます。不揃いなデザインをGridで再現することで、デザイン性を保ちながらスムーズなレスポンシブ対応を実現しました。