【问题标题】:Pause video on native Chrome HTML5 Player with TamperMonkey Script使用 TamperMonkey 脚本在本机 Chrome HTML5 播放器上暂停视频
【发布时间】:2021-09-03 16:56:51
【问题描述】:

我正在尝试设置一个 TamperMonkey 脚本来使键盘按键暂停本机 Chrome 视频播放器,而无需单击它或使用 Space Bar

为了实现这一点,我尝试设置一个脚本,该脚本会在视频显示在页面上的x, y coordinate 中触发点击操作。

到目前为止,它没有工作。

// PAUSE VIDEO - ASSIGNED TO *Q* KEY
    (function(){
    document.addEventListener('keydown', function(e) {
    if (e.keyCode == 81 && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
    document.elementFromPoint(448, 540).click(); // this should trigger the click on video to pause event
    }
    }, false);
    })();

谁能告诉我如何使用Q 键暂停此视频?

【问题讨论】:

    标签: javascript greasemonkey tampermonkey


    【解决方案1】:

    原生 HTMLVideoElement 在点击时不会播放/暂停,因此您需要使用 .play().pause() 方法,根据 .paused 只读确定是播放还是暂停布尔值。如果只有 .togglePlayback() 方法就好了,但没有。

    (顺便说一句,using KeyboardEvent.keyCode is depricated 支持 KeyboardEvent.key。它仍然适用于主要的网络浏览器以实现向后兼容性,但它已在标准中被正式弃用)

    在 StackOverflow 上,确保在单击蓝色按钮后单击代码 sn-p(白色框)内的任意位置。

    (function () {
        document.addEventListener('keydown', function (e) {
                if (e.key == 'q' && !e.shiftKey && !e.ctrlKey && !e.altKey && !e.metaKey) {
                    const video = document.querySelector('video');
                    // or = document.elementFromPoint(448, 540); if that's where it will always be
                    if (video.paused) video.play();
                    else video.pause();
                }
            },
        );
    })();
    <!-- Simple video example -->
    <!-- 'Big Buck Bunny' licensed under CC 3.0 by the Blender foundation. Hosted by archive.org -->
    <!-- Poster from peach.blender.org -->
    <video controls
        src="https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4"
        poster="https://peach.blender.org/wp-content/uploads/title_anouncement.jpg?x11217"
        width="300">
    </video>

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2012-05-06
      • 1970-01-01
      • 1970-01-01
      • 2015-09-03
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多