添加一个选项以通过我页面上的链接更改嵌入的 vimeo 视频

Question

这是我的截图

现在在 Gigi 和 Bob 手下我有 5 首歌 link。我想 link 这些直接到我页面中的 vimeo 播放器例如，当用户点击 Gigi 下的 "Silence" 歌曲 link 时，视频将转到这首歌。

Gig 下的歌曲列表当前html是

<ul>
    <li><a href="#">L'Amour</a></li>
    <li><a href="#">Bla Bla Bla</a></li>
    <li><a href="#">The Riddle</a></li>
    <li><a href="#">Another Way</a></li>
    <li><a href="#">Silence</a></li>
</ul>

vimeo 视频是

<section id="player">
    <iframe src="https://player.vimeo.com/video/105778399" width="200" height="150" frameborder="1" webkitallowfullscreen mozallowfullscreen allowfullscreen>
    </iframe>
</section>

Answer 1

如果您只想播放嵌入了 url 的视频，那么您可以将链接定位到 iframe。您只需要 iframe 上的 name 属性和链接上的 target 属性：

demo

<a href="https://player.vimeo.com/video/45196609?autoplay=1" target="VimeoPlayer">L'Amour</a>

<section id="player">
    <iframe src="https://player.vimeo.com/video/105778399" name="VimeoPlayer" width="200" height="150" frameborder="1" webkitallowfullscreen mozallowfullscreen allowfullscreen>
    </iframe>
</section>

如果您想要更复杂的东西，可以使用 API 将 Vimeo 播放器集成到您的网站中 JavaScript：https://github.com/vimeo/player.js

添加一个选项以通过我页面上的链接更改嵌入的 vimeo 视频

add an option to change embedded vimeo video through links on my page

html

vimeo

vimeo-player

embedded-video