山本剛工務店HP

URL
https://www.yamamoto-tsuyoshi.com/
担当範囲
静的コーディング / Wordpress構築
制作期間
30日
使用言語
HTML / CSS(Sass) / JavaScript / PHP / Wordpress
デザインツール
Figma
ポイント
  • Point 1 直感的に使えるドロップダウンメニュー

    • 階層を整理したメニュー構造により、必要な情報へ迷わずアクセス可能。
    • "jQueryのクリックイベントを用いて、スムーズに開閉する仕組みを実装。
  • Point 2 魅力を伝える “スライダー表現”

    • 建築現場の雰囲気が伝わる写真を配置し、視覚的な印象を向上。
    • "Swiper"を使用。"loop"や"autoplay"を活用して滑らかな切り替えを実装。
  • Point 3 トップへ戻るボタン(スクロールで表示/スムーススクロール対応)

    • 300px以上スクロールした際、.c-to-top に js-show を付け外しして、opacity と visibility でフェード表示。
    • クリックするとwindow.scrollTo({ top: 0, behavior: 'smooth' }) でスムーススクロール。
全体イメージ
Prev 制作実績 Next