【jQuery】「Contact Form 7」でエラー発生時に特定要素までスクロールする処理

[ ID : 11477 ]
シルバー
【jQuery】「Contact Form 7」でエラー発生時に特定要素までスクロールする処理
実装目安
3分

概要

WPプラグイン「Contact Form 7」で実装したフォームにおいて、入力エラーが発生した場合に特定要素までスクロールする処理をjQueryを使用して実装。

用途・要件

  • WPプラグイン「Contact Form 7」を使用したフォームにおいて、入力内容にエラーがあった場合に、特定の要素にスクロールさせる。
  • 最初のエラー発生箇所にスクロールする例を記載。
  • jQueryのanimate()を使用してスムーススクロールする。
  • 固定ヘッダーがある場合に、固定ヘッダーの高さ分スクロール位置をずらす。

その他

  • Contact Form 7 v5.7.2使用。
  • jQuery v3.6.1使用。

検証ブラウザ

  • Google Chrome(最新)
  • Microsoft Edge(最新)
  • Firefox(最新)
  • Safari(最新)

実装

このコンテンツの続きを閲覧するにはログインが必要です。 新規会員登録

この記事をシェアする

全ての記事を見る

KONOCODEのメリット 無料会員登録