###HTML5<video>をスクロールに応じてon/offする(jQuery/JavaScript)
html5の<video>タグで出力されている動画をスクロールに応じて、playとpauseを切り替えたいのですが、やり方がよくわかりません。具体的には、スクロールして画面に動画部分が見え始めた時に再生し、見えなくなり始めると停止する方法です。
以下のようなjQueryのコードを見つけたのですが、これではすでに再生中の動画をスクロールで過ぎていく時に停止することしかできません。
何か良い方法がございましたらご教授お願いいたします。
HTML
<video id="player" autoplay loop > <source src="hoge.mp4" type="video/mp4"> </video><
jQuery
var video; $(window).ready(function() { video = $("#player")[0]; window.onscroll = function(){ if($(window).scrollTop() > 1000){ if(!video.paused){ video.pause(); } }else{ if(video.paused){ video.play(); } } } });
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2017/07/14 09:19