视频控件在 HTML 列表中不起作用
Posted
技术标签:
【中文标题】视频控件在 HTML 列表中不起作用【英文标题】：Video controls are not working inside of a list in HTML 【发布时间】：2022-01-06 11:38:36 【问题描述】：我正在尝试在 html 中制作一个滑块，其中一个选项必须有一个视频，但是当我点击视频选项时，尽管视频显示控件不起作用。通过自动播放，视频开始播放，但我无法停止或对其执行任何操作
这是滑块代码
<body>
<ul class="slider">
<li id="slide1"><p class="texto_diapositiva">Diapositiva 1</p></li>
<li id="slide2"><p class="texto_diapositiva">Diapositiva 2</p></li>
<li id="slide3"><p class="texto_diapositiva">Diapositiva 3</p></li>
<li id="slide4">
<div>
<video class="videoCV" controls>
<source src="video/VideoCV_FRE.mp4" type="video/mp4">
</video>
</div>
</li>
<li id="slide5"><p class="texto_diapositiva">Diapositiva 5</p></li>
</ul>
<nav>
<ul class="menu">
<li><a href="#slide1">Diapositiva 1</a></li>
<li><a href="#slide2">Diapositiva 2</a></li>
<li><a href="#slide3">Diapositiva 3</a></li>
<li><a href="#slide4">Diapositiva 4</a></li>
<li><a href="#slide5">Diapositiva 5</a></li>
</ul>
</nav>
</body>
【问题讨论】：
无法重现您的问题（在 Chrome 中测试）。转到W3schools video 页面并将您的代码放在那里（将您的 MP4 路径替换为movie.mp4... 视频控件仍然有效。您是否有可能在视频标签上方有一些透明的 div 分层？这意味着有些东西不会让您点击浏览它到它下面的视频...
【参考方案1】：
尝试添加自定义控件。这可能会有所帮助：https://developer.mozilla.org/en-US/docs/Web/Guide/Audio_and_video_delivery/Video_player_styling_basics
【讨论】：
以上是关于视频控件在 HTML 列表中不起作用的主要内容，如果未能解决你的问题，请参考以下文章
HTML5 视频播放/暂停控件仅在 Safari 浏览器中不起作用
HTML 'img' 标签在 WebBrowser 控件中不起作用