ポスターがクリックされたとき、およびコントロールバーの再生ボタンがクリックされたときに再生されるHTML5ビデオがあります。ビデオが再生されるたびに起動するトラッキングピクセルが必要です。ビデオをdivでラップし、ピクセルを起動するonlickをdivに追加しました。ポスター/ビデオ領域がクリックされると起動します。しかし、divがコントロールをカバーしていても、コントロール領域をクリックしても起動しません。コントロールへのクリックをキャッチするにはどうすればよいですか?または、ビデオがいつ再生されるかを決定し、ピクセルを発射します。
コードは次のとおりです。
<div onclick="obApi('track', 'Watch Video');">
<video controls="controls" style="width: 100%;" poster="https://cdn.shopify.com/s/files/1/0315/7737/t/2/assets/poster_fox.jpg" onclick="this.play();">
<source src="https://cdn.shopify.com/s/files/1/0315/7737/files/fw_fox.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
</div>
ビデオタグには、聞くことができる多くのイベントがあります。 1つは
play
です ビデオが一時停止されなくなると起動します。そのイベントをリッスンする方法の例を次に示します。