zoukankan      html  css  js  c++  java
  • H5多媒体

    Video

    <video width="500px" controls="controls">
        <source src="test.ogg" type="video/ogg" />
        你的浏览器不支持video
    </video>

    控件是可以隐藏的,可以自定义控件

    <button onclick="playPause()">播放/暂停</button>
    <button onclick="makeBig()"></button>
    <button onclick="makeNormal()"></button>
    <button onclick="makeSmall()"></button>
    <br />
    <video id="video1" width="500px">
        <source src="test.ogg" type="video/ogg" />
    </video>
    
    <script type="text/javascript">
    var myVideo = document.getElementById("video1");
    
    function playPause(){
        if (myVideo.paused){
            myVideo.play();
        }
        else{
            myVideo.pause();
        }
    }
    
    function makeBig(){
        myVideo.width = 600;
    }
    function makeNormal(){
        myVideo.width = 500;
    }
    function makeSmall(){
        myVideo.width = 400;
    }
    </script>

    Audio

    <audio controls="controls">
        <source src="song.mp3" type="audio/mepg" />
        <source src="song.ogg" type="audio/ogg" />
        Your browser does not support the audio tag.
    </audio>

    H5还提供了很多多媒体的API,运用这些API可以做出精美的视频播放器和音乐播放器,时间有限,等我以后再来更新。

  • 相关阅读:
    Git学习
    flask学习5 错误页面
    flask学习4-会话
    flask学习3
    线性代数复习
    flask学习2
    flask学习1
    windows下安装easy_install,pip,及flask入门教程链接
    MacOS Terminal调用Python代码
    [java] 类变量初始化顺序
  • 原文地址:https://www.cnblogs.com/zcynine/p/4987433.html
Copyright © 2011-2022 走看看