javascript - Onscroll 视频必须播放一次

Question

使用scrolltop，我使用if条件将滚动分为5部分。在第二部分中，我给出了scrolltop值从600到700px的视频。如果我再次滚动，视频会在该位置播放多次。但我希望视频必须如果我在该值内任意次数，则播放一次。

var scrolld=window.scrollTop();
if(scrolld >=600) {
  ///i gave image here
}

elseif((Scrolld >600) & (scrolld <=700)){
//video
}

//rest 3 elseif contain images

检查此链接: http://projects.lollypop.biz/auluxa/lighting.html

如果我使用鼠标滚动，它工作正常。但是如果我使用 keyup 和 keydown(键盘)滚动，视频会播放很多次。

Answer 1

请看一下这段代码。我确实认为这就是你的意思，因为我的网站上也有这个，但你的问题不是很清楚。您至少可以分享一下您的代码吗？

$('#vid').on('ended', function(){this.playedThrough = true;});

$(window).scroll(function(){
    var myVideo = document.getElementById("vid");

    if($(window).scrollTop() > 300 && $(window).scrollTop() < 975){
       // only if we didn't reached the end yet
       if(!myVideo.playedThrough)
          myVideo.play();
    }else{
       myVideo.pause();
    }
 })