Q&A
Closed
サイトを別タブまたはバックグランドにした場合、slickで動かしているバナーは動いているのでしょうか？
※該当のバナーのslickはautoplay: trueにしているため自動で再生し続けます。
バナーのIMP計測をするに当たりバックグランドでもslickが動いている場合、正しいIMPが計測できない。
該当のバナーが画面外になったらslickを止めるという処理は実装しています。
バックグランドでの動きについてわかる方教えてください。
よろしくお願いします。
slick の autoplay で使われる setInterval は、バックグラウンドタブでの実行間隔が間引かれることが知られています。 https://www.wantedly.com/companies/wantedly/post_articles/439961
実際の再生間隔を知るには slick の afterChange イベントでログを出力するといいでしょう。
$('バナー要素').on('afterChange', () => {
console.log(new Date().toISOString());
});
バックグラウンド化されたときにバナーを止めるには visibilitychange イベントが使えます。
document.addEventListener('visibilitychange', () => {
if (document.visibilityState === 'visible') {
// バナーを再度動かす
} else {
// バナーを止める
}
});