浏览代码

add option.danmaku.margin to prevent block video subtitles

WooLNinesun 8 年之前
父节点
当前提交
ce936277e3
共有 2 个文件被更改,包括 15 次插入2 次删除
  1. 4 1
      demo/index.html
  2. 11 1
      src/html.js

+ 4 - 1
demo/index.html

@@ -23,7 +23,10 @@
                 },
                 danmaku: {
                     id: '9E2E3368B56CDBB4',
-                    api: 'https://api.prprpr.me/dplayer/'
+                    api: 'https://api.prprpr.me/dplayer/',
+                    margin: {
+                        bottom:'15%'
+                    }
                 }
             });
         </script>

+ 11 - 1
src/html.js

@@ -13,7 +13,7 @@ const html = {
             ${option.logo ? `
             <div class="dplayer-logo"><img src="${option.logo}"></div>
             ` : ``}
-            <div class="dplayer-danmaku">
+            <div class="dplayer-danmaku" style="${option.danmaku ? html.danmakumargin(option.danmaku.margin) : ``}">
                 <div class="dplayer-danmaku-item dplayer-danmaku-item--demo"></div>
             </div>
             <div class="dplayer-bezel">
@@ -174,6 +174,16 @@ const html = {
         <div class="dplayer-notice"></div>`;
     },
 
+    danmakumargin: (margin) => {
+        let result = '';
+        if (margin) {
+            for (const key in margin) {
+                result += `${key}:${margin[key]};`;
+            }
+        }
+        return result;
+    },
+
     contextmenuList: (contextmenu) => {
         let result = '<div class="dplayer-menu">';
         for (let i = 0; i < contextmenu.length; i++) {