如何在不使用JavaScript的页面下的情况下单击空间来暂停视频

穆罕默德·索利曼(Mohamed Soliman)

我使用JavaScript构建了自定义视频播放器,并且当我单击“空间”以停止视频时,页面就会掉下来,我需要防止这种情况

我的JavaScript代码

      window.onkeydown = vidCtrl;

    function vidCtrl(e){
      const vid = document.querySelector('video')
      const key = e.code;

      if (key === 'ArrowLeft') {
    vid.currentTime -= 5;
    if (vid.currentTime < 0) {
      vid.pause();
      vid.currentTime = 0;
    }
  } else if (key === 'ArrowRight') {
    vid.currentTime += 5;
    if (vid.currentTime > vid.duration) {
      vid.pause();
      vid.currentTime = 0;
    }
  } else if (key === 'Space') {
    if (vid.paused || vid.ended) {
      vid.play();
    } else {
      vid.pause();
    }
  
  
  }
阿里·萨萨尼(Ali Sasani)

e.preventDefault()当用户按下空格键时添加以防止不必要的滚动

else if (key === 'Space') {
    e.preventDefault();
    if (vid.paused || vid.ended) {
      vid.play();
    } else {
      vid.pause();
    }
  
  
  }

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在不使用JavaScript的页面下的情况下单击空间来暂停视频

来自分类Dev

如何在不使用 UpdatePanel 的情况下单击 RadioButtonList 时停止页面重新加载?

来自分类Dev

如何在不使用任何templateresolver的情况下如何使用thymeleaf命名空间包含页面的页眉和页脚?

来自分类Dev

如何在不使用php或javascript在页面底部显示地址的情况下打印文档

来自分类Dev

如何在不使用Leaflet.draw UI的情况下单击按钮并开始新的多边形

来自分类Dev

如何在不使用Leaflet.draw UI的情况下单击按钮并开始新的多边形

来自分类Dev

如何在不使用twilio的情况下使用python和opencv传输视频?

来自分类Dev

如何在不使用KMC的情况下使用Kaltura Player设置视频默认图像?

来自分类Dev

如何在不使用页面文本的情况下获取dompdf中的页面数

来自分类Dev

如何在不使用外部视频文件的情况下播放文件

来自分类Dev

如何在不使用javascript更改页面的情况下访问文件上传所选文件?

来自分类Dev

如何在不使用javascript更改页面的情况下访问文件上传所选文件?

来自分类Dev

如何在不使用固定高度值的情况下使div访问剩余空间?

来自分类Dev

如何在不使用额外空间的情况下解决这个问题?

来自分类Dev

如何在不使用固定高度值的情况下使div访问剩余空间?

来自分类Dev

如何在不使用额外空间的情况下反转堆栈…fp样式

来自分类Dev

如何在不使用 JS 代码的情况下单击以 Thunderbird 作为附件发送的 html-css 文件中的选项卡?

来自分类Dev

如何在不使用awt或swing的情况下右键单击而弹出菜单?

来自分类Dev

如何在不使用jQuery的情况下创建简单的页面垂直滚动条?

来自分类Dev

React Native:如何在不使用NavigatorIOS组件的情况下切换页面?

来自分类Dev

如何在不使用.htaccess的情况下创建404页面

来自分类Dev

如何在不使用_layout查询字符串参数的情况下重新加载页面

来自分类Dev

如何在不使用 facebook api 的情况下获取 facebook 页面帖子?

来自分类Dev

如何在不使用新标签页打开同一页面的情况下使用javascript刷新另一页面

来自分类Dev

如何在不使用jQuery但使用纯Javascript的情况下使用AJAX提交此表单

来自分类Dev

如何在不使用jQuery但使用纯Javascript的情况下使用AJAX提交此表单

来自分类Dev

如何在不使用$ scope的情况下使用$ emit / $ on?

来自分类Dev

如何在不使用xml的情况下使用ViewPager?

来自分类Dev

如何在不使用mysql的情况下使用表

Related 相关文章

  1. 1

    如何在不使用JavaScript的页面下的情况下单击空间来暂停视频

  2. 2

    如何在不使用 UpdatePanel 的情况下单击 RadioButtonList 时停止页面重新加载?

  3. 3

    如何在不使用任何templateresolver的情况下如何使用thymeleaf命名空间包含页面的页眉和页脚?

  4. 4

    如何在不使用php或javascript在页面底部显示地址的情况下打印文档

  5. 5

    如何在不使用Leaflet.draw UI的情况下单击按钮并开始新的多边形

  6. 6

    如何在不使用Leaflet.draw UI的情况下单击按钮并开始新的多边形

  7. 7

    如何在不使用twilio的情况下使用python和opencv传输视频?

  8. 8

    如何在不使用KMC的情况下使用Kaltura Player设置视频默认图像?

  9. 9

    如何在不使用页面文本的情况下获取dompdf中的页面数

  10. 10

    如何在不使用外部视频文件的情况下播放文件

  11. 11

    如何在不使用javascript更改页面的情况下访问文件上传所选文件?

  12. 12

    如何在不使用javascript更改页面的情况下访问文件上传所选文件?

  13. 13

    如何在不使用固定高度值的情况下使div访问剩余空间?

  14. 14

    如何在不使用额外空间的情况下解决这个问题?

  15. 15

    如何在不使用固定高度值的情况下使div访问剩余空间?

  16. 16

    如何在不使用额外空间的情况下反转堆栈…fp样式

  17. 17

    如何在不使用 JS 代码的情况下单击以 Thunderbird 作为附件发送的 html-css 文件中的选项卡?

  18. 18

    如何在不使用awt或swing的情况下右键单击而弹出菜单?

  19. 19

    如何在不使用jQuery的情况下创建简单的页面垂直滚动条?

  20. 20

    React Native:如何在不使用NavigatorIOS组件的情况下切换页面?

  21. 21

    如何在不使用.htaccess的情况下创建404页面

  22. 22

    如何在不使用_layout查询字符串参数的情况下重新加载页面

  23. 23

    如何在不使用 facebook api 的情况下获取 facebook 页面帖子?

  24. 24

    如何在不使用新标签页打开同一页面的情况下使用javascript刷新另一页面

  25. 25

    如何在不使用jQuery但使用纯Javascript的情况下使用AJAX提交此表单

  26. 26

    如何在不使用jQuery但使用纯Javascript的情况下使用AJAX提交此表单

  27. 27

    如何在不使用$ scope的情况下使用$ emit / $ on?

  28. 28

    如何在不使用xml的情况下使用ViewPager?

  29. 29

    如何在不使用mysql的情况下使用表

热门标签

归档