Question

我正在为我的平面设计学士学位开展一次网络活动，而我的想法之一是需要比现在更多的编程知识。我的问题如下：

是否存在某种代码，可以根据滚动来前后播放视频？我找到了滚动时播放和暂停的多种方法，但这不是我想要的。我希望用户能够向后和向前滚动视频。

此外，用最少的编程知识很难做到吗？我目前了解HTML和CSS的原理，并且可以在无需帮助的情况下编辑代码，但是我不太擅长将所有内容从头开始整合在一起。我对javascript没有任何经验。

我希望我能使自己理解，这不完全是我的专业领域。

谢谢！

Answer 1

我在评论中如何提到您可以根据鼠标滚轮事件设置视频“ currentTime”：

var video = document.getElementById('video');

$(window).bind('mousewheel DOMMouseScroll', function(event){
    if (event.originalEvent.wheelDelta > 0 || event.originalEvent.detail < 0) {
       video.currentTime += 5;
    }
    else {
       video.currentTime -= 5;
    }
});

video{
    height: 400px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<video id="video" controls="controls">
	<source src="https://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4">
	<source src="https://www.quirksmode.org/html5/videos/big_buck_bunny.webm" type="video/webm">
	<source src="https://www.quirksmode.org/html5/videos/big_buck_bunny.ogv" type="video/ogg">
</video>

当前没有方法可以反向播放视频。

是否可以使视频对滚动做出反应？

1 个答案: