实例代码“Ctrl+/”提示“F11/ESC”全屏 返回 格式化 恢复 运行
​x
 
1
<!DOCTYPE HTML>
2
<html>
3
    <head>
4
        <meta charset="utf-8">
5
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
7
        <title>jQuery有趣的弹幕视频video插件</title>
8
        <link rel="stylesheet" href="/api/jq/5733e34bef9c5/css/main.css">
9
    </head>
10
    <body>
11
        <div class="container">
12
            <div class="demo">
13
                <div id="danmup" style="margin:20px auto"></div>
14
            </div>
15
        </div>
16
        <script src="/api/jq/5733e34bef9c5/js/jquery-2.1.4.min.js"></script>
17
        <script src="/api/jq/5733e34bef9c5/js/jquery.shCircleLoader.js"></script>
18
        <script src="/api/jq/5733e34bef9c5/js/jquery.danmu.js"></script>
19
        <script src="/api/jq/5733e34bef9c5/js/main.js"></script>
20
        <script>
21
            $("#danmup").DanmuPlayer({
22
                //src: "http://download4.vlook.cn/c267fab3e28f5dce9fafa706d619bfcf/57230e8f/video/vga/fv-L.mp4",
23
                src: "http://vjs.zencdn.net/v/oceans.mp4",
24
                //src: "http://download4.vlook.cn/83ebe2b4ec671565313d141443f89bfb/57234f72/video/high/fpYg.mp4",
25
                height: "480px", //区域的高度
26
                width: "800px" //区域的宽度
27
//                , urlToGetDanmu: "getData.php"
28
//                , urlToPostDanmu: "sendData.php"
29
            });
30
            $("#danmup .danmu-div").danmu("addDanmu", [
31
                {"text": "这是滚动弹幕", color: "white", size: 1, position: 0, time: 2}
32
                , {"text": "我是帽子绿", color: "green", size: 1, position: 0, time: 3}
33
                , {"text": "手册网火火火", color: "#f30", size: 1, position: 0, time: 10}
34
                , {"text": "这是黄色的弹幕", color: "yellow", size: 1, position: 0, time: 3}
35
                , {"text": "好快啊", color: "red", size: 1, position: 0, time: 19}
36
                , {"text": "大家好，我是打不死的小强", color: "orange", size: 1, position: 0, time: 23}
37
            ])
38
        </script>
39
    </body>
40
</html>
41
​