<aside> <img src="/icons/list_gray.svg" alt="/icons/list_gray.svg" width="40px" /> 目次

</aside>

LPcats JavaScript イベントドキュメント

LPcatsは、生成したLP上で発生する様々なイベントをトリガーとして、カスタム動作を実装するための強力なJavaScriptイベントを提供しています。このドキュメントでは、各イベントの詳細と使用方法を説明します。

📌イベント一覧

1. lpcats:ctaClick

説明: CTAをクリックした後、CTAアクションを実行する直前に発生します。

使用例:

document.addEventListener('lpcats:ctaClick', function(event) {
  // CTAクリック時の処理  
  console.log('CTA clicked:', event.detail);  
  // CTAのクリックをキャンセルする場合  
  event.preventDefault();
});

イベントオブジェクト (event.detail):

• currentTarget: CTAがメディアタイプだった場合はCTAに表示されている画像のimg要素、HTMLタイプだった場合はクリックされた要素のElement（event.srcElementから取得）
• ctaElement: CTAのElement（.lpCta）
• currentStepElement: 現在表示されているステップのElement（.x）
• currentStepIndex: 現在表示されているステップのページ番号（0からスタート）
• stepCount: ステップの総数
• lpElement: LPcatsのElement（#lpcats）

2. lpcats:stepChangeStart

説明: 他のステップ（次または前）へ移動開始直前にイベントが発生します。

使用例:

document.addEventListener('lpcats:stepChangeStart', function(event) {
  // ステップ変更開始時の処理  
  console.log('Step change started:', event.detail);
});