47 lines
1.5 KiB
JavaScript
47 lines
1.5 KiB
JavaScript
var video;
|
|
$(function(){
|
|
video = document.getElementById('video');
|
|
|
|
|
|
// btn
|
|
var st_play = '<i class="fa fa-play-circle-o" aria-hidden="true"></i>';
|
|
var st_pause = '<i class="fa fa-pause-circle-o" aria-hidden="true"></i>';
|
|
|
|
video.ontimeupdate = function(){
|
|
var percentage = ( video.currentTime / video.duration ) * 100;
|
|
$("#time span").css("width", percentage+"%");
|
|
};
|
|
|
|
$("#time").on("click", function(e){
|
|
var offset = $(this).offset();
|
|
var left = (e.pageX - offset.left);
|
|
var totalWidth = $("#time").width();
|
|
var percentage = ( left / totalWidth );
|
|
var vidTime = video.duration * percentage;
|
|
video.currentTime = vidTime;
|
|
})
|
|
$("#volume span").css('width',(100*video.volume)+'%')
|
|
$("#volume").on("click", function(e){
|
|
var offset = $(this).offset();
|
|
var left = (e.pageX - offset.left);
|
|
var totalWidth = $("#volume").width();
|
|
var percentage = ( left / totalWidth );
|
|
var volume = 1 * percentage;
|
|
video.volume = volume;
|
|
$("#volume span").css('width',(100*percentage)+'%')
|
|
console.log(volume)
|
|
})
|
|
|
|
|
|
|
|
$('#play').click(function(){
|
|
if(video.paused){
|
|
video.play();
|
|
$('#play').html(st_pause)
|
|
}else{
|
|
video.pause();
|
|
$('#play').html(st_play)
|
|
}
|
|
})
|
|
})
|