jQuery的週期和嵌入式YouTube西元 - 當視頻播放

我使用的是循環到一個站點，其中一些需要在YouTube視頻的頭版上旋轉的內容各個位暫停。當用戶播放視頻時，我希望這個循環暫停，但我正在努力。jQuery的週期和嵌入式YouTube西元 - 當視頻播放

這裏的例子：How do I attach a jQuery event handler to a YouTube movie?似乎不再工作，還有什麼更近的技術的人知道嗎？谷歌不轉了很多除了在這裏的幾篇文章我見過它，沒有一個似乎工作了（我假設谷歌已經改變了YT API，因爲他們提出了..）

任何幫助不勝感激！

來源

2011-07-15 artparks

我有一個類似的問題，但Vimeo。我提出的解決方案應該適用於YouTube或任何類似的嵌入。

對於旋轉木馬，只顯示視頻縮略圖。 YouTube和Vimeo都提供了一種直接獲取各種分辨率縮略圖的方式（例如，用於YouTube的How do I get a YouTube video thumbnail from the YouTube API?）。確保每張圖片都有一個（唯一）ID，您可以從中獲取嵌入視頻所需的所有詳細信息（例如，您可以使用YouTube ID作爲HTML ID）。

附加一個jQuery點擊處理程序的圖像。點擊處理程序從圖像的ID中獲取要顯示哪些視頻的相關信息，隱藏轉盤容器並插入相關代碼，以將視頻顯示在與傳送帶位置相同的另一個元素中。

例如： -

<div id="carousel"> 
    <img src="youtubethumbnailurl1" id="1234" /> 
    <img src="youtubethumbnailurl2" id="2345" /> 
    <img src="youtubethumbnailurl3" id="3456" /> 
</div> 

<div id="video"></div> 


<script type="text/javascript"> 
    jQuery(function($) { 
    $('#carousel img').click(function(e){ 
     e.preventDefault; 
     $('#carousel').hide(); 
     var video_id = $(this).attr("id"); 
     $('#video').html(vid_iframe(video_id)).show(); 
     return false; 
    }); 

    function vid_iframe(video_id) { 
     return "<iframe src='youtubeurl'+video_id+'youtubeParameters'?</iframe>"; 
    } 
    }); 
</script>

你需要添加相應的處理程序，關閉視頻，如果需要返回到轉盤。

這有點複雜，但適用於任何類型的嵌入，並且還爲事物顯示提供了很大的靈活性（例如在我的情況下，縮略圖必須比實際播放時的視頻小得多）。

來源

2011-07-15 13:26:44 rowatt

要暫停的週期（上懸停），然後播放視頻（點擊上）。

只需在視頻上疊加一個空的div（#slidestop）（匹配視頻容器的CSS屬性，使其尺寸相同），並添加下面的代碼，它就像魅力一樣！

$('#slidestop').hover(function() { 
$('#homeslides').cycle('pause'); 
$('#slidestop').hide(); 
});

來源

2012-08-31 13:59:41 Rich

jQuery的週期和嵌入式YouTube西元 - 當視頻播放

回答

相關問題