1

一年多前，我在堆栈上收到了这段代码 -用图像覆盖 youtube 嵌入式视频，单击时隐藏图像并自动播放

请在实践中查看 - http://plnkr.co/edit/WbWvOR 或预览 http://run.plnkr.co/plunks/WbWvOR/

它工作得很好，但是我现在想稍微修改一下，这样视频也会在鼠标悬停时自动播放，比如 - http://www.interactivepixel.net/ccLivePlaylist/index_wall.html

欢迎所有想法，感谢您的帮助

朱迪

4

1 回答 1

0

您所看到的实际上并不是在播放来自 YouTube 或 Vimeo 的视频。它正在播放存储在其服务器上的短片。

例如，这是您在 InteractivePixel 链接上看到的第一个框的视频。

该脚本是一个名为“Tean 的 Live Playlist”的付费脚本。他可以在 CodeCanyon 上购买他的代码和文档。

如果您想在您的网站上拥有该功能，我建议您购买脚本，或者在“HTML 5 Live Playlist”或类似内容上进行搜索。

否则，要在 mouseover 上播放视频，因为您使用 HTML5 嵌入视频，您可以使用 jQuery.hover()和常规 javascript的组合.play()。但是请记住，它不会像您展示的演示那样流畅，因为在悬停时，它必须出去并与 YouTube 建立连接才能开始播放视频。

$("#theVideoElement").hover(function(){
   document.getElementById('videoId').play();
});

要让它在没有控件的情况下显示，您需要将您的controlsURL 参数设置iframe为 0。

$('#ytapiplayer2').append('<iframe width="1130" height="636" src="http://www.youtube.com/embed/YOURVIDEOCODEHERE?controls=0" frameborder="0" allowfullscreen></iframe>');
于 2013-03-31T16:22:35.827 回答