Youtube/vimeo/any在懸停時播放的視頻縮略圖（不彈出）

我需要創建在鼠標懸停中播放的youtube/vimeo /任何視頻縮略圖。有人請教我如何做到這一點？我猜JavaScript，但沒有通過研究得到任何地方。我不想彈出，只是爲了使視頻保持與縮略圖相同的尺寸並播放。Youtube/vimeo/any在懸停時播放的視頻縮略圖（不彈出）

最後，我將在10x5網格中填充一個頁面。

謝謝

來源

2014-02-11 user3277125

像這樣的東西？ http://stackoverflow.com/questions/15556552/auto-pause-or-play-html5-video-on-hover –

嗨我看到這之前我張貼但是我需要的是將鼠標懸停在縮略圖和視頻加載內縮略圖的確切尺寸。所以縮略圖是鏈接以及視頻的佔位符。本教程有單獨的文本鏈接。 – user3277125

那麼，爲什麼不直接使用相同的代碼，而是將鼠標懸停在視頻的容器上？ –

使用mouseenter和mouseleave可以播放/暫停上徘徊的視頻......像這樣的東西應該工作：

的Javascript

$("#video-holder").mouseenter(function(){ 
    document.getElementById('video1').play(); 
}); 
$("#video-holder").mouseleave(function(){ 
    document.getElementById('video1').pause(); 
});

HTML

<div id="video-holder"> 
    <video id="video1"> 
     <source src="..." type="video/ogg"> 
    </video> 
</div>

http://jsfiddle.net/yD49P/

來源

2014-02-11 21:19:55

你好，謝謝你的工作出色，有沒有辦法，當你懸停，以及視頻開始，我可以做一個圖像的背景更改？對不起，是一個痛苦 – user3277125

@ user3277125我很困惑，視頻的背景？你不能看到... –

我只是說如果我添加一個div begind它或使現有的視頻持有人更大 – user3277125

Youtube/vimeo/any在懸停時播放的視頻縮略圖（不彈出）

回答

相關問題