DPlayer.js 비디오 재생 플러그 인 사용 방법
2631 단어 DPlayer.js비디오플러그 인
주로 영상 재생,감청 시작,종료,일시 정지,재생 시간,전환 영상 을 사용 했다.
공식 문서:http://dplayer.js.org
효과 그림:
**
주의:저 는 현지에서 서 비 스 를 시 작 했 습 니 다.랜 으로 핸드폰 테스트 에 연 결 했 습 니 다.그 중에서 애플 핸드폰 에서 영상의 이동 영상 위치 가 효력 을 잃 었 고 안 드 로 이 드 핸드폰 이 좋 습 니 다.아직 해결 되 지 않 았 습 니 다.나중에 시간 이 있 으 면 계속 업 데 이 트 될 것 입 니 다.
**
코드 부분 html:
<link rel="stylesheet" href="css/dplayer.min.css">
<script src="js/dplayer.min.js"></script>
<div id="dplayer" style="font-size: 12px;"></div>
<button class="click1"> </button>
js:
$(function () { //
const dplayer = new DPlayer({
container: document.getElementById('dplayer'),
video: {
url: 'video/001.mp4', //
pic: 'images/banner1.png', //
thumbnails: 'images/banner2.png', //
type: 'auto'
},
});
dplayer.seek('6.972618'); //
//
$('.click1').click(function () {
switchVideos();
})
//
dplayer.on('play', function () {
console.log(" ");
dplayer.seek('6.972618'); //
});
dplayer.on('pause', function () {
console.log(" ");
console.log(dplayer.video.currentTime); //
});
dplayer.on('ended', function () {
console.log(" ");
});
dplayer.on('error', function () {
console.log(" ");
});
})
function switchVideos() {
// ajax
// ......
dplayer.switchVideo({
url: 'video/002.mp4', // data URL
pic: 'images/banner2.png', //
thumbnails: 'images/banner2.png' //
})
}
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
IOS에서 ReplayKit 및 RTC 사용 방법응용된 소리와 아나운서의 소리를 포함한다.이 두 가지 수요를 감안하여 우리는 스크린 공유를 하는 생방송에 필요한 미디어 흐름을 간단하게 분석할 수 있다. 만약 우리가 Audio App과 Audio Mic를 두 개의 ...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.