H5视频，播放，暂停，重新播放

落日映苍穹つ 2022-05-08 00:10 401阅读 0赞

### H5视频，播放，暂停，重新播放 ###

```<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>Document</title>
    </head>
    <body>
        <video src="https://pic.ibaotu.com/00/41/33/24B888piCexZ.mp4" ></video>
    </body>
    <script >
    
    var video =  document.querySelector('video');
    var totalTime = 0;
    var currentTime = 0;
    function start() {
        video.play();
    
    }
    video.addEventListener('loadedmetadata', function() {
        totalTime = video.duration;
    })
    video.addEventListener('timeupdate', function() {
        currentTime  = video.currentTime;
    })
    video.onload = function () {
        start()
    
    }
    function pause() {
        video.pause();
        
    }
    function volum (value) {
        video.volume = value;
    }
    function restart() {
        video.currentTime = totalTime;
        video.play();
    }
    </script>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，401人围观）

还没有评论，来说两句吧...

相关阅读

相关 H5 video播放视频，微信内小窗播放

腾讯对微信尤其是安卓版本的内置浏览器内核做了一点点小处理，在X5内核下，播放会强制全屏，如果需要进行边视频边互动下则无法实现。无论使用百度或者是科学上网google都没有解

浅浅的花香味﹌/ 2023年10月11日 12:19/ 0 赞/ 36 阅读

相关 H5播放视频流

代码 <html> <head> <title>视频直播</title> <meta charset="utf-8">

浅浅的花香味﹌/ 2023年01月22日 11:55/ 0 赞/ 269 阅读

相关 H5视频全屏播放

H5视频全屏播放 <div class="video-box"> <video x5-video-player-type="h5" x5-vi

亦凉/ 2022年12月29日 06:58/ 0 赞/ 326 阅读

相关 videojs多个视频一起播放暂停

需求多个视频要用同一个进度条控制播放暂停 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_tex

布满荆棘的人生/ 2022年11月03日 14:27/ 0 赞/ 415 阅读

相关 h5播放音乐

h5音频播放，里面参数可以查看http://www.w3school.com.cn/html5/html_5_audio.asp <audio control

拼搏现实的明天。/ 2022年08月05日 02:53/ 0 赞/ 295 阅读

相关 h5视频播放

html5提供的有视频播放功能，标签可以使用video demo如下： <div class="video"> <video src="video/Vision

谁借莪１个温暖的怀抱￠/ 2022年08月03日 12:55/ 0 赞/ 328 阅读

相关 html5_视频播放

1. 视频播放 <table> <tbody> <tr> <td style="background:rgb(213,213,213);"><p><stro

悠悠/ 2022年05月25日 05:08/ 0 赞/ 383 阅读

相关 H5视频，播放，暂停，重新播放

H5视频，播放，暂停，重新播放 ```<!DOCTYPE html> <html lang="en"> <head> <meta

落日映苍穹つ/ 2022年05月08日 00:10/ 0 赞/ 402 阅读

相关 html5视频播放

<!DOCTYPE html> <head> <meta charset=utf-8> <title>html5播放器</title>

逃离我推掉我的手/ 2022年03月18日 09:24/ 0 赞/ 423 阅读

相关 js之 H5 的 video 标签暂停播放视频

一、问题基于 video 标签播放的视频，大致功能是，点击预览按钮，弹出弹框，可以在线观看视频；如果关闭弹框，视频还是在播放。二、要求关

蔚落/ 2021年08月04日 11:07/ 0 赞/ 667 阅读