video.js 實現(xiàn)視頻只能后退不能快進的思路詳解
更新時間：2018年08月09日 11:36:55 作者：橘子烙餅-yinjj
這篇文章主要介紹了video.js 實現(xiàn)視頻只能后退不能快進的思路詳解，主要思路是點擊進度條需要獲取拖動前的時間點，具體實例代碼大家跟隨小編一起看看吧
主要思路是點擊進度條需要獲取拖動前的時間點，我用mouseup事件去處理的，獲得到了oldTime 就好辦，然后根據(jù)需求限制拖動快進快退，因為項目允許回看，不允許快進，所以得記錄maxTime，記錄用戶正常情況觀看視頻最大的那個時間點，不允許超過maxTime
var isMousedown = false;
var oldTime=0,newTime=0,maxTime=0;
//拖動進度條會先執(zhí)行這個事件
$(".vjs-progress-holder").mouseup(function() {
isMousedown = true;
oldTime = vid1.currentTime();
});
//vid1就是videojs對象
vid1.on('timeupdate', function(){
if(isMousedown){
if(vid1.currentTime() > maxTime) {
vid1.currentTime(oldTime);
}
isMousedown=false;
}else{
if(vid1.currentTime() > maxTime) {
maxTime = vid1.currentTime();
}
}
});
總結(jié)
以上所述是小編給大家介紹的video.js 實現(xiàn)視頻只能后退不能快進的思路詳解，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
JavaScript實現(xiàn)點擊出現(xiàn)子菜單效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實現(xiàn)點擊出現(xiàn)子菜單，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-02-02
JavaScript 節(jié)流函數(shù) Throttle 詳解
這篇文章主要為大家詳細(xì)介紹了JavaScript 節(jié)流函數(shù) Throttle，感興趣的小伙伴們可以參考一下2016-07-07
這篇文章主要介紹了原生js實現(xiàn)照片墻效果，幫助大家更好的利用js制作特效，感興趣的朋友可以了解下2020-10-10
用于CSS代碼壓縮與格式化的javascript函數(shù)代碼
呵呵，發(fā)現(xiàn)只要幾行ＪＳ代碼就可實現(xiàn)css的壓縮與格式化，非常不錯。2009-12-12
這篇文章主要為大家詳細(xì)介紹了JS實現(xiàn)玩轉(zhuǎn)風(fēng)車，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
圖片的上傳預(yù)覽功能主要用于圖片上傳前的一個效果的預(yù)覽，這篇文章主要介紹了Javascript圖片上傳前的本地預(yù)覽實例,需要的朋友可以參考下2014-06-06
IE下Ajax緩存問題的快速解決方法(get方式)。網(wǎng)上搜了很多解決方案，一大把，下面是我認(rèn)為比較全面的解決方案。主要分為客戶端解決和服務(wù)端解決2014-01-01
這篇文章主要介紹了js判斷登錄與否并確定跳轉(zhuǎn)頁面的方法,涉及Ajax及session使用的技巧,非常具有實用價值,需要的朋友可以參考下2015-01-01
js常用方法、檢查是否有特殊字符串、倒序截取字符串操作完整示例
這篇文章主要介紹了js常用方法、檢查是否有特殊字符串、倒序截取字符串操作,結(jié)合完整實例形式分析了JavaScript字符串轉(zhuǎn)換、檢測、倒序、截取等相關(guān)操作技巧,需要的朋友可以參考下2020-01-01
本文主要介紹了JS跳過debugger的幾種方法小結(jié)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07