Bping-playerJs
/
video.html

<!DOCTYPE HTML>
<html>
<header>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge;chrome"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script type="text/javascript" src="player-0.9.min.js"></script>
    <!--<script type="text/javascript" src="./src/coreJs.js"></script>-->
    <!--<script type="text/javascript" src="./src/utilJs.js"></script>-->
    <!--<script type="text/javascript" src="./src/playJs.js"></script>-->
</header>
<link rel="stylesheet" href="css/index.css"/>
<body>
<div id="mainContainer" style="height: 664px; width: 1080px; margin: 0px auto; background-color: white;">
    <div id="drawContainer" width="1080" height="600"
         style="border:1px solid #c3c3c3;margin:0 auto;background-color:white;">
        <div id="canvasDiv" style="display: block;">
        </div>
        <div class="pencil" id="pencil"></div>
        <div id="info" class="info">
            <p style="opacity: 0;">暂停</p>
        </div>
        <audio id="drawAudio">
        </audio>

    </div>
    <div class="player" id="player" style="top: 600px; width: 1082px; display: block; margin-bottom: 0px;">
        <div class="scrubber" id="scrubber">
            <div id="progress" class="progress" style="width: 0%;"></div>
            <div id="loaded" class="loaded" style="width: 100%;"></div>
            <div class="scrubber-track" id="scrubber-track">
                <div id="progressBtn" class="scrubber-draggable progress-tracker" style="left: 0%;"></div>
            </div>
        </div>
        <div class="buttons">
            <ul class="play-pause" id="play-pause">
                <li class="play" id="play" style="display: list-item;"><a href="#"></a></li>
                <li class="pause" id="pause" style="display: none;"><a href="#"></a></li>
                <li class="warn"></li>
            </ul>
            <ul class="volume-bar">
                <li class="volume volume-on"><a href="#"></a></li>
                <div class="volume-scrubber" id="volume-scrubber">
                    <div class="progress" id="volume-progress" style="width: 50%;"></div>
                </div>
            </ul>
            <div class="time" id="time">
                <em class="played" id="time_played">00:00</em>/<strong class="duration"
                                                                       id="time_duration">00:00</strong>
            </div>
        </div>
        <div class="player-bg"></div>
    </div>
</div>


<script type="application/javascript">
    $(document).ready(function () {
        videoUI.handler(util.strToObj(location.search.split('?')[1]));
    })
</script>

</body>
</html>