2011-12-10 14 views
1

我想在特定時刻暫停正在播放的視頻,直到彈出的問題得到解答。用戶不應該繼續前進並轉發視頻,直到剛剛彈出的特定問題得到解答。如何鎖定HTML5中的控件,直到發生特定事件?

因此,我可以在該特定時刻使用JS暫停視頻。如何才能確保視頻的控件已解鎖或只有在回答彈出的問題後再次播放視頻?

回答

2

看看這個演示的http://jsfiddle.net/dgLds/58/

var video = document.getElementById("myvideo"); 


function toggleControls() { 
    document.getElementById('myvideo').pause(); 
    if (video.hasAttribute("controls")) { 
    video.removeAttribute("controls") 
    } else { 
    video.setAttribute("controls","controls") 
    } 
} 


<video id="myvideo"> 
    <source src="http://www.w3schools.com/html5/movie.mp4" /> 
</video> 

<p onclick="toggleControls();">Toggle</p> 

,而不是點擊,你可以調用函數時,任何你想要

這裏是一切歌劇的文章,你想了解HTML5視頻http://dev.opera.com/articles/view/everything-you-need-to-know-about-html5-video-and-audio/

詳細請看如何保持物件同步部分

編輯:我想禁用右鍵單擊選項。先走一步,在該標籤/ ID

這裏禁用右鍵點擊是jQuery代碼

$('video').bind('contextmenu', function() 
    { 
     alert('no right click.'); 
     return false; 
    }); 
+0

是啊,這似乎不錯,但一個人仍然可以點擊右鍵並播放視頻..有什麼方法執行那個? –

+1

再次看演示http://jsfiddle.net/dgLds/58/ – aWebDeveloper

+0

我期待着一個類似於崇高視頻播放器的解決方案..在右鍵點擊我們可以選擇html5/flash –

0

有可用於video元件的pause()方法:

document.getElementById('myVideo').pause(); 

同樣,有play()

1

我跑進需要能夠禁用上下文菜單我今天因爲我們有自己的自定義控件。你可以這樣做很容易:

video.addEventListener('contextmenu', function(e) { 
    e.preventDefault(); 
    return false; 
}); 

他是在Web開發的演示建立了一個例子:http://jsfiddle.net/dgLds/308/

相關問題