You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

滚动控制视频播放时,视频自带暂停按钮失效问题求助

Solution for Video Auto-Play/Pause with User Manual Control Respect

Got it, let's fix this issue for you! The core problem with your current code is that it ignores the user's manual pause action—every time you scroll past 13500px, it forces the video to play no matter what. We can solve this by adding a flag to track whether the user has manually paused the video, and only let the scroll-based auto-control work when the user hasn't taken over.

Here's the revised code with explanations:

$(document).ready(function() {
  // Flag to track if user manually paused the video
  let userPaused = false;
  const vid = document.getElementById("video_1");

  // Listen for user's manual pause action
  vid.addEventListener('pause', function() {
    // Only set the flag if the pause wasn't triggered by scroll logic
    if ($(document).scrollTop() > 13500) {
      userPaused = true;
    }
  });

  // Listen for user's manual play action
  vid.addEventListener('play', function() {
    userPaused = false;
  });

  $(window).scroll(function() {
    const scrollPos = $(document).scrollTop();
    // Only apply auto-play/pause if user hasn't manually paused
    if (!userPaused) {
      if (scrollPos > 13500) {
        vid.play();
      } else {
        vid.pause();
      }
    }
  });
});

Key Changes Explained:

  • userPaused Flag: This variable keeps track of whether the user has intentionally paused the video. It starts as false (meaning auto-control is active by default).
  • Video pause Event Listener: When the video is paused, we check if we're in the scroll range where auto-play would normally trigger. If yes, we assume this pause was a manual user action and set userPaused to true.
  • Video play Event Listener: If the user manually plays the video again, we reset userPaused to false, letting the scroll-based auto-control take over again.
  • Scroll Event Logic: We now wrap the auto-play/pause code in a check for !userPaused—so if the user has manually paused, the scroll event won't interfere with their choice.

This way, the video follows scroll-based auto-control until the user takes manual control (pauses it), and if they play it again manually, the auto-control resumes working.

内容的提问来源于stack exchange,提问作者Rob

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.14 06:53:50