如何停止嵌入视频的自动播放?

huangapple go评论73阅读模式
英文:

How to stop auto play in an embedded video?

问题

I understand your request. Here's the translated code portion:

<blockquote class="tiktok-embed" cite="https://www.tiktok.com/@fairytailcrossing/video/7219450454705573162" data-video-id="7219450454705573162" style="max-width: 605px;min-width: 325px;" > <section> <a target="_blank" title="@fairytailcrossing" href="https://www.tiktok.com/@fairytailcrossing?refer=embed">@fairytailcrossing</a> Aiight 🤓👏🏻 S/O to Type sent me a fanny pack for healthcare workers. Go check out link in my bio to order your own all proceeds go to help healthcare workers. <a title="fyp" target="_blank" href="https://www.tiktok.com/tag/fyp?refer=embed">#fyp</a> <a title="foryou" target="_blank" href="https://www.tiktok.com/tag/foryou?refer=embed">#foryou</a> <a title="fannypack" target="_blank" href="https://www.tiktok.com/tag/fannypack?refer=embed">#fannypack</a> <a title="aiight" target="_blank" href="https://www.tiktok.com/tag/aiight?refer=embed">#aiight</a> <a title="laboratory" target="_blank" href="https://www.tiktok.com/tag/laboratory?refer=embed">#laboratory</a> <a title="laboratorylife" target="_blank" href="https://www.tiktok.com/tag/laboratorylife?refer=embed">#laboratorylife</a> <a title="dance" target="_blank" href="https://www.tiktok.com/tag/dance?refer=embed">#dance</a> <a title="dancing" target="_blank" href="https://www.tiktok.com/tag/dancing?refer=embed">#dancing</a> <a title="hospitallife" target="_blank" href="https://www.tiktok.com/tag/hospitallife?refer=embed">#hospitallife</a> <a title="healthcareworker" target="_blank" href="https://www.tiktok.com/tag/healthcareworker?refer=embed">#healthcareworker</a> <a target="_blank" title="♬ AIGHT - WESTSIDE BOOGIE & DRAM" href="https://www.tiktok.com/music/AIGHT-7086655651392260097?refer=embed">♬ AIGHT - WESTSIDE BOOGIE & DRAM</a> </section> </blockquote> <script async src="https://www.tiktok.com/embed.js"></script>

Please note that I've retained the original code structure and only translated the text content within the HTML.

英文:

I am trying to embed a tik tok into a landing page hosted on unbounce. The tik tok embed link is straight from tik tok and as is, the tik tok will automatically play when the web page is open. Is there a way to turn this off in the code? I want the video to be there but only playing if the user clicks play.

<blockquote class="tiktok-embed" cite="https://www.tiktok.com/@fairytailcrossing/video/7219450454705573162" data-video-id="7219450454705573162" style="max-width: 605px;min-width: 325px;" > <section> <a target="_blank" title="@fairytailcrossing" href="https://www.tiktok.com/@fairytailcrossing?refer=embed">@fairytailcrossing</a> Aiight 🤓👏🏻  S/O to Type sent me a fanny pack for healthcare workers. Go check out link in my bio to order your own all proceeds go to help healthcare workers. <a title="fyp" target="_blank" href="https://www.tiktok.com/tag/fyp?refer=embed">#fyp</a> <a title="foryou" target="_blank" href="https://www.tiktok.com/tag/foryou?refer=embed">#foryou</a> <a title="fannypack" target="_blank" href="https://www.tiktok.com/tag/fannypack?refer=embed">#fannypack</a> <a title="aiight" target="_blank" href="https://www.tiktok.com/tag/aiight?refer=embed">#aiight</a> <a title="laboratory" target="_blank" href="https://www.tiktok.com/tag/laboratory?refer=embed">#laboratory</a> <a title="laboratorylife" target="_blank" href="https://www.tiktok.com/tag/laboratorylife?refer=embed">#laboratorylife</a> <a title="dance" target="_blank" href="https://www.tiktok.com/tag/dance?refer=embed">#dance</a> <a title="dancing" target="_blank" href="https://www.tiktok.com/tag/dancing?refer=embed">#dancing</a> <a title="hospitallife" target="_blank" href="https://www.tiktok.com/tag/hospitallife?refer=embed">#hospitallife</a> <a title="healthcareworker" target="_blank" href="https://www.tiktok.com/tag/healthcareworker?refer=embed">#healthcareworker</a> <a target="_blank" title="♬ AIGHT - WESTSIDE BOOGIE & DRAM" href="https://www.tiktok.com/music/AIGHT-7086655651392260097?refer=embed">♬ AIGHT - WESTSIDE BOOGIE & DRAM</a> </section> </blockquote> <script async src="https://www.tiktok.com/embed.js"></script>

This is the embed link provided. I've tried to add an autoplay = 0 to some of the urls but that didn't work. Not sure what other options there are.

答案1

得分: 1

我找到了这个懒加载 TikTok 嵌入的 Web 组件。它很容易使用。视频仍然会播放,但只有在滚动到可见时才会播放。不完美,但性能影响较小。

我尝试将 data-autoplay="false" muted 添加到 blockquote,但失败了。我找不到其他解决方案。

英文:

I found this web component that lazy loads TikTok embeds. It's easy to use. The video still plays, but not until you scroll into view. Not perfect, but def less of a performance hit.

I tried adding data-autoplay="false" muted to the blockquote, but that failed. I couldn't find any other solutions.

答案2

得分: 0

要停止嵌入的 TikTok 视频自动播放,您可以使用 muted 属性。将 muted 属性添加到 blockquote 元素中,以防止页面加载时视频自动播放。

以下是修改后的代码:

<blockquote
      class="tiktok-embed"
      cite="https://www.tiktok.com/@fairytailcrossing/video/7219450454705573162"
      data-video-id="7219450454705573162"
      style="max-width: 605px; min-width: 325px"
      muted // 在这里添加 muted
    >

      // 您的代码

</blockquote>
英文:

To stop the auto-play of an embedded TikTok video, you can use the muted attribute. Add the muted attribute to the blockquote element to prevent the video from playing automatically when the page loads.

Here's the modified code:

<blockquote
      class="tiktok-embed"
      cite="https://www.tiktok.com/@fairytailcrossing/video/7219450454705573162"
      data-video-id="7219450454705573162"
      style="max-width: 605px; min-width: 325px"
      muted // put muted here
    >

      // your code

</blockquote>

答案3

得分: 0

You can use below code for stop autoplay.

<blockquote class="tiktok-embed" cite="https://www.tiktok.com/@fairytailcrossing/video/7219450454705573162" data-video-id="7219450454705573162" style="max-width: 605px; min-width: 325px;" autoplay="0">
    <!-- ... rest of the code ... -->
</blockquote>
<script async src="https://www.tiktok.com/embed.js"></script>
英文:

You can use below code for stop autoplay.

&lt;blockquote class=&quot;tiktok-embed&quot; cite=&quot;https://www.tiktok.com/@fairytailcrossing/video/7219450454705573162&quot; data-video-id=&quot;7219450454705573162&quot; style=&quot;max-width: 605px; min-width: 325px;&quot; autoplay=&quot;0&quot;&gt;
&lt;!-- ... rest of the code ... --&gt;

</blockquote>
<script async src="https://www.tiktok.com/embed.js"></script>

huangapple
  • 本文由 发表于 2023年5月15日 02:19:23
  • 转载请务必保留本文链接:https://go.coder-hub.com/76249039.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定