将 HTML5 href 链接添加到视频标签

Question

我正在尝试添加一个 href 视频链接，因此当您单击该视频时，它会将您定向到另一个 HTML 页面。显然，它只能用 jquery 一个博客说但不确定。

 <video class="tutorial_vid" width="220" height="140" autoplay="autoplay" loop> //EDIT: loop="true" is deprecated nowadays
  <source src="vid/Rolling_Ice_x264.mp4" type="video/mp4" />
  <source src="movie.ogg" type="video/ogg" />
  Your browser does not support the video tag.
</video>

代码到此为止。任何帮助将不胜感激。提前致谢。

原文由 Andy14 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

我会认为，如果你想点击某个东西导航到另一个页面，你实际上需要一个 anchor() 链接。您当然可以设置链接的样式，使其 看起来 像视频（使用图像或其他东西）。

如果那不是你想要的，我想你总是可以用链接包围视频标签：

 <a href="yourpage.html">
   <video class="tutorial_vid" width="220" height="140" autoplay="autoplay" loop>
      //EDIT: loop="true" is deprecated nowadays
      <source src="vid/Rolling_Ice_x264.mp4" type="video/mp4" />
      <source src="movie.ogg" type="video/ogg" />
   </video>
</a>

原文由 Céryl Wiltink 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

小提琴

jQuery // 您可以使用 jQuery 添加一个简单的基于点击的重定向

$('.tutorial_vid').click(function(){
    window.location = 'http://google.com';
});

CSS // 使用 CSS 使其在鼠标悬停时显示为可点击

.tutorial_vid {
    cursor: pointer;
}

如果你仍然想要一个 href 解决方案，这个 jQuery 方法应该添加属性。

 $('.tutorial_vid2').attr('href', 'http://google.com');

希望这可以帮助！！

原文由 wrxsti 发布，翻译遵循 CC BY-SA 3.0 许可协议