隐藏页面内容直到视频中的特定时间

发布于 2024-12-08 17:50:22 字数 1010 浏览 0 评论 0 原文

我和我的员工一直在研究如何设置一个页面来隐藏显示在 Youtube 视频中特定点的内容。

一开始我们通过使用 settimeout() 函数很快就达到了目标，但这只是经过的时间，而不是视频中的时间。如果视频暂停（例如，在指定的时间长度后），隐藏的内容无论如何都会出现。

到目前为止，这是我们的代码：

<p>
<script type="text/javascript">// <![CDATA[
    function showIt() {
        document.getElementById("hid").style.display = "block";
    }
    setTimeout("showIt()",30000);
    // 1000 = 1 sec | 60000 is 1 minute
    // ]]></script>
</p>
<p>{youtube}Yhwk5OorNPw&amp;rel=0&amp;autoplay=1&amp;showinfo=0&amp;version=3|640|390{/youtube}</p>
<div id="hid" style="display: none;">
    <p style="text-align: center;"><span style="font-size: 32pt; color: #ff6600;"><strong><a target="_blank" href="http://www.youtube.com/watch?v=K80leSIhSD4"><span style="color: #ff6600;">HEY RICK - You can buy a Website Now!</span></a></strong></span></p>
</div>

如果您知道如何在视频到达特定时间时触发它，那将非常有帮助！

原文

My staff and I have been researching how to set up a page to have hidden content, that appears at a specific point in a Youtube video.

We got there quickly at first by using the settimeout() function, but this just goes by elapsed time, not the time in the video. If the video is paused, for example, after the specified length of time, the hidden content appears anyway.

This is our code so far:

<p>
<script type="text/javascript">// <![CDATA[
    function showIt() {
        document.getElementById("hid").style.display = "block";
    }
    setTimeout("showIt()",30000);
    // 1000 = 1 sec | 60000 is 1 minute
    // ]]></script>
</p>
<p>{youtube}Yhwk5OorNPw&rel=0&autoplay=1&showinfo=0&version=3|640|390{/youtube}</p>
<div id="hid" style="display: none;">
    <p style="text-align: center;"><span style="font-size: 32pt; color: #ff6600;"><strong><a target="_blank" href="http://www.youtube.com/watch?v=K80leSIhSD4"><span style="color: #ff6600;">HEY RICK - You can buy a Website Now!</span></a></strong></span></p>
</div>

If you know a way to have it triggered with the video gets to a a specific time, that would be very helpful!!!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

玩心态 2024-12-15 17:50:22

最好的方法是获取当前 YouTube 视频的每秒时间。

您可以使用 setInterval 每秒调用该函数。在该函数中获取当前的 YouTube 视频时间，并据此进行操作。我认为这是一种可靠的方法，

请检查这个答案。从答案中您可以了解如何从 YouTube 播放器获取当前播放时间。希望它对您有帮助

编辑

我想您想在视频 30 秒后显示隐藏的内容。为此，您必须捕获 youtube 视频的当前时间。要获取当前时间，您必须使用 youtube API。您可以了解有关 API 的更多信息。您将从这里

一旦你获得当前时间（你将以秒为单位），如果你使用api，你可以使用以下逻辑来显示隐藏内容

<script type="text/javascript">
var timerForLoadingResult=  setInterval(showIt,1000);//call the fnction in every seconds.
     function showIt() {
       var currentTime=GetCurrentYoutubeTime(); // this function must return a current time in seconds
       if(currentTime>=30) // i guess u need to show up after30 th second
        {
          document.getElementById("hid").style.display = "block";
          clearInterval(timerForLoadingResult);        //it will clear the timer, so the function will not excecute again
        }
      }
     function  GetCurrentYoutubeTime()
    {
      // fetch youtube video time using api . and return that value
    }
 </script>

The best way is get current YouTube video time in every seconds .

You can use setInterval to call the function every seconds. In that function get current YouTube video time and based on that do your operations.I think this is a reliable way

Please check this answer .From the answer you can understand how to get current play time from YouTube player. Hope it helps you

EDIT

I guess you want to show the hidden content after 30 second of the video. To do so you must capatur the youtube video current time.To get current time you must use youtube API .You can leanr more infor about API .You will get more info about API from here

Once you get the current time ( you will get that in seconds) if u use api you can use following logic to show up the hidden content

<script type="text/javascript">
var timerForLoadingResult=  setInterval(showIt,1000);//call the fnction in every seconds.
     function showIt() {
       var currentTime=GetCurrentYoutubeTime(); // this function must return a current time in seconds
       if(currentTime>=30) // i guess u need to show up after30 th second
        {
          document.getElementById("hid").style.display = "block";
          clearInterval(timerForLoadingResult);        //it will clear the timer, so the function will not excecute again
        }
      }
     function  GetCurrentYoutubeTime()
    {
      // fetch youtube video time using api . and return that value
    }
 </script>

回复收藏 0 原文

~没有更多了~