Merge branch 'master' into master

2019-06-06 16:32:01 +08:00 · 2019-06-06 16:32:01 +08:00 · 7cab972297
parent 29e4a93d73 590f89e972
commit 7cab972297
22 changed files with 3298 additions and 2563 deletions
--- a/README.md
+++ b/README.md
@ -46,10 +46,20 @@ Using DPlayer on your project? [Let me know!](https://github.com/DIYgod/DPlayer/

 ## Thanks

+## Special Sponsors
+
+<a href="https://www.polyv.net/?f=git_DPlayer-20190518-02" target="_blank">
+    <img width="600px" src="https://i.loli.net/2019/06/03/5cf4028f7b8f716387.gif">
+</a>
+
+<a href="https://www.9ccms.net" target="_blank">
+    <img width="330px" src="https://i.imgur.com/YBV6kfb.png">
+</a>
+
 ### Sponsors

-<a href="https://pear.hk/" target="_blank">
-    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+<a href="https://www.dogecloud.com/?ref=dplayer" target="_blank">
+    <img width="222px" src="https://i.imgur.com/BBKXPAp.png">
 </a>
 <a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
    <img width="222px" src="https://imgur.com/apG1uKf.png">
@ -97,6 +107,7 @@ Feel free to submit yours in [`Let me know!`](https://github.com/MoePlayer/DPlay

 ## Who use DPlayer?

+- [学习强国](https://itunes.apple.com/cn/app/%E5%AD%A6%E4%B9%A0%E5%BC%BA%E5%9B%BD/id1426355645?mt=8): “学习强国”学习平台精心打造的手机客户端
 - [小红书](https://www.xiaohongshu.com/): 中国最大的生活社区分享平台，同时也是发现全球好物的电商平台
 - [极客时间](https://time.geekbang.org/): 极客邦科技出品的一款 IT 内容知识服务 App
 - [嘀哩嘀哩](http://www.dilidili.wang/): 兴趣使然的无名小站（D站）
@ -119,7 +130,6 @@ We accept donations through these channels:
 - [Paypal](https://www.paypal.me/DIYgod)
 - [WeChat Pay](https://i.imgur.com/aq6PtWa.png)
 - [Alipay](https://i.imgur.com/wv1Pj2k.png)
- Bitcoin: 13CwQLHzPYm2tewNMSJBeArbbRM5NSmCD1

 ## Recurring Pledges

--- a/demo/demo.js
+++ b/demo/demo.js
@ -19,10 +19,10 @@ function handleEvent () {
        const $clickDom = e.currentTarget;
        const isShowStatus = $clickDom.getAttribute('data-show');

-        if (!!isShowStatus) {
+        if (isShowStatus) {
            document.getElementById('float-dplayer').style.display = 'none';
        } else {
-          $clickDom.setAttribute('data-show', 1);
+            $clickDom.setAttribute('data-show', 1);
            document.getElementById('float-dplayer').style.display = 'block';
        }
    });
@ -42,16 +42,16 @@ function initPlayers () {
        preload: 'none',
        screenshot: true,
        video: {
-          url: 'http://static.smartisanos.cn/common/video/t1-ui.mp4',
-          pic: 'http://static.smartisanos.cn/pr/img/video/video_03_cc87ce5bdb.jpg',
-          thumbnails: 'http://static.smartisanos.cn/pr/img/video/video_03_cc87ce5bdb.jpg'
+            url: 'http://static.smartisanos.cn/common/video/t1-ui.mp4',
+            pic: 'http://static.smartisanos.cn/pr/img/video/video_03_cc87ce5bdb.jpg',
+            thumbnails: 'http://static.smartisanos.cn/pr/img/video/video_03_cc87ce5bdb.jpg'
        },
        subtitle: {
-          url: 'subtitle test'
+            url: 'subtitle test'
        },
        danmaku: {
-          id: '9E2E3368B56CDBB4',
-          api: 'https://api.prprpr.me/dplayer/'
+            id: '9E2E3368B56CDBB4',
+            api: 'https://api.prprpr.me/dplayer/'
        }
    });
    // dp1
@ -60,9 +60,9 @@ function initPlayers () {
        preload: 'none',
        screenshot: true,
        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
+            url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
+            pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png',
+            thumbnails: 'https://i.loli.net/2019/06/06/5cf8c5d9cec8510758.jpg'
        },
        subtitle: {
            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt'
@ -82,13 +82,13 @@ function initPlayers () {
        loop: true,
        screenshot: true,
        hotkey: true,
-        logo: 'https://moeplayer.b0.upaiyun.com/dplayer/DPlayer.png',
+        logo: 'https://i.loli.net/2019/06/06/5cf8c5d94521136430.png',
        volume: 0.2,
        mutex: true,
        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg',
+            url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
+            pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png',
+            thumbnails: 'https://i.loli.net/2019/06/06/5cf8c5d9cec8510758.jpg',
            type: 'auto'
        },
        subtitle: {
@ -151,11 +151,11 @@ function initPlayers () {
    //             type: 'hls'
    //         }, {
    //             name: 'SD',
-    //             url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
+    //             url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
    //             type: 'normal'
    //         }],
    //         defaultQuality: 0,
-    //         pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png'
+    //         pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png'
    //     }
    // });

@ -244,8 +244,8 @@ function clearPlayers () {
 function switchDPlayer () {
    if (dp2.option.danmaku.id !== '5rGf5Y2X55qu6Z2p') {
        dp2.switchVideo({
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/flowerdance.mp4',
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/flowerdance.jpg',
+            url: 'http://static.smartisanos.cn/common/video/t1-ui.mp4',
+            pic: 'http://static.smartisanos.cn/pr/img/video/video_03_cc87ce5bdb.jpg',
            type: 'auto',
        }, {
            id: '5rGf5Y2X55qu6Z2p',
@ -255,9 +255,9 @@ function switchDPlayer () {
        });
    } else {
        dp2.switchVideo({
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg',
+            url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
+            pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png',
+            thumbnails: 'https://i.loli.net/2019/06/06/5cf8c5d9cec8510758.jpg',
            type: 'auto'
        }, {
            id: '9E2E3368B56CDBB42',
--- a/dist/DPlayer.min.css
+++ b/dist/DPlayer.min.css
--- a/dist/DPlayer.min.css.map
+++ b/dist/DPlayer.min.css.map
--- a/dist/DPlayer.min.js
+++ b/dist/DPlayer.min.js
--- a/dist/DPlayer.min.js.map
+++ b/dist/DPlayer.min.js.map
--- a/docs/README.md
+++ b/docs/README.md
@ -8,8 +8,18 @@ search: english

 ## Special Sponsors

-<a href="https://pear.hk/" target="_blank">
-    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+<a href="https://www.polyv.net/?f=git_DPlayer-20190518-02" target="_blank">
+    <img width="600px" src="https://i.loli.net/2019/06/03/5cf4028f7b8f716387.gif">
+</a>
+
+<a href="https://www.9ccms.net" target="_blank">
+    <img width="330px" src="https://i.imgur.com/YBV6kfb.png">
+</a>
+
+## Sponsors
+
+<a href="https://www.dogecloud.com/?ref=dplayer" target="_blank">
+    <img width="222px" src="https://i.imgur.com/BBKXPAp.png">
 </a>
 <a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
    <img width="222px" src="https://imgur.com/apG1uKf.png">
@ -63,8 +73,8 @@ const dp = new DPlayer({
 Work with module bundler:

 ```js
-import 'DPlayer/dist/DPlayer.min.css';
-import DPlayer from 'DPlayer';
+import 'dplayer/dist/DPlayer.min.css';
+import DPlayer from 'dplayer';

 const dp = new DPlayer(options);
 ```
--- a/docs/config.js
+++ b/docs/config.js
@ -83,8 +83,8 @@ function dplayer1 () {
        container: document.getElementById('dplayer1'),
        video: {
            url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
+            pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png',
+            thumbnails: 'https://i.loli.net/2019/06/06/5cf8c5d9cec8510758.jpg'
        },
        danmaku: {
            id: '9E2E3368B56CDBB4',
@ -96,14 +96,10 @@ function dplayer1 () {
 function dplayer2 () {
    window.dp2 = new DPlayer({
        container: document.getElementById('dplayer2'),
-        screenshot: true,
        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
-        },
-        subtitle: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt'
+            url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
+            pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png',
+            thumbnails: 'https://i.loli.net/2019/06/06/5cf8c5d9cec8510758.jpg'
        },
        danmaku: {
            id: '9E2E3368B56CDBB4',
@ -119,25 +115,17 @@ function dplayer3 () {
        theme: '#FADFA3',
        loop: true,
        lang: 'zh-cn',
-        screenshot: true,
        hotkey: true,
        preload: 'auto',
-        logo: 'https://moeplayer.b0.upaiyun.com/dplayer/DPlayer.png',
+        logo: 'https://i.loli.net/2019/06/06/5cf8c5d94521136430.png',
        volume: 0.7,
        mutex: true,
        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg',
+            url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
+            pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png',
+            thumbnails: 'https://i.loli.net/2019/06/06/5cf8c5d9cec8510758.jpg',
            type: 'auto'
        },
-        subtitle: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.vtt',
-            type: 'webvtt',
-            fontSize: '25px',
-            bottom: '10%',
-            color: '#b7daff'
-        },
        danmaku: {
            id: '9E2E3368B56CDBB4',
            api: 'https://api.prprpr.me/dplayer/',
@ -179,16 +167,16 @@ function dplayer4 () {
        video: {
            quality: [{
                name: 'HD',
-                url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
+                url: 'https://api.dogecloud.com/player/get.m3u8?vcode=5ac682e6f8231991&userId=17&ext=.m3u8',
                type: 'hls'
            }, {
                name: 'SD',
-                url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.mp4',
+                url: 'https://api.dogecloud.com/player/get.mp4?vcode=5ac682e6f8231991&userId=17&ext=.mp4',
                type: 'normal'
            }],
            defaultQuality: 0,
-            pic: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.png',
-            thumbnails: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara_thumbnails.jpg'
+            pic: 'https://i.loli.net/2019/06/06/5cf8c5d9c57b510947.png',
+            thumbnails: 'https://i.loli.net/2019/06/06/5cf8c5d9cec8510758.jpg'
        }
    });
 }
@ -197,27 +185,27 @@ function dplayer5 () {
    window.dp5 = new DPlayer({
        container: document.getElementById('dplayer5'),
        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
+            url: 'https://api.dogecloud.com/player/get.m3u8?vcode=5ac682e6f8231991&userId=17&ext=.m3u8',
            type: 'hls'
        }
    });
 }

 function dplayer6 () {
-    window.dp6 = new DPlayer({
-        container: document.getElementById('dplayer6'),
-        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/dash/hikarunara.mpd',
-            type: 'dash'
-        }
-    });
+    // window.dp6 = new DPlayer({
+    //     container: document.getElementById('dplayer6'),
+    //     video: {
+    //         url: 'https://moeplayer.b0.upaiyun.com/dplayer/dash/hikarunara.mpd',
+    //         type: 'dash'
+    //     }
+    // });
 }

 function dplayer7 () {
    window.dp7 = new DPlayer({
        container: document.getElementById('dplayer7'),
        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hikarunara.flv',
+            url: 'https://api.dogecloud.com/player/get.flv?vcode=5ac682e6f8231991&userId=17&ext=.flv',
            type: 'flv'
        }
    });
@ -249,7 +237,7 @@ function dplayer9 () {
            }
        },
        video: {
-            url: 'https://moeplayer.b0.upaiyun.com/dplayer/hls/hikarunara.m3u8',
+            url: 'https://api.dogecloud.com/player/get.m3u8?vcode=5ac682e6f8231991&userId=17&ext=.m3u8',
            type: 'hls'
        }
    });
--- a/docs/ecosystem.md
+++ b/docs/ecosystem.md
@ -47,6 +47,7 @@ Let's make DPlayer better, feel free to submit yours in [`Let me know!`](https:/

 ## Who use DPlayer?

+- [学习强国](https://itunes.apple.com/cn/app/%E5%AD%A6%E4%B9%A0%E5%BC%BA%E5%9B%BD/id1426355645?mt=8): “学习强国”学习平台精心打造的手机客户端
 - [小红书](https://www.xiaohongshu.com/): 中国最大的生活社区分享平台，同时也是发现全球好物的电商平台
 - [极客时间](https://time.geekbang.org/): 极客邦科技出品的一款 IT 内容知识服务 App
 - [嘀哩嘀哩](http://www.dilidili.wang/): 兴趣使然的无名小站（D站）
--- a/docs/support.md
+++ b/docs/support.md
@ -19,7 +19,6 @@ We accept donations through these channels:
 - [Paypal](https://www.paypal.me/DIYgod)
 - [WeChat Pay](https://i.imgur.com/aq6PtWa.png)
 - [Alipay](https://i.imgur.com/wv1Pj2k.png)
- Bitcoin: 13CwQLHzPYm2tewNMSJBeArbbRM5NSmCD1

 ## Recurring Pledges

@ -30,10 +29,20 @@ Recurring pledges come with exclusive perks, e.g. having your name or your compa

 ## Current Premium Sponsors

-### Special Sponsors
+## Special Sponsors

-<a href="https://pear.hk/" target="_blank">
-    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+<a href="https://www.polyv.net/?f=git_DPlayer-20190518-02" target="_blank">
+    <img width="600px" src="https://i.loli.net/2019/06/03/5cf4028f7b8f716387.gif">
+</a>
+
+<a href="https://www.9ccms.net" target="_blank">
+    <img width="330px" src="https://i.imgur.com/YBV6kfb.png">
+</a>
+
+### Sponsors
+
+<a href="https://www.dogecloud.com/?ref=dplayer" target="_blank">
+    <img width="222px" src="https://i.imgur.com/BBKXPAp.png">
 </a>
 <a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
    <img width="222px" src="https://imgur.com/apG1uKf.png">
--- a/docs/zh-Hans/README.md
+++ b/docs/zh-Hans/README.md
@ -7,10 +7,20 @@ search: zh-Hans

 🍭 Wow, such a lovely HTML5 danmaku video player

-## 特别赞助商
+## Special Sponsors

-<a href="https://pear.hk/" target="_blank">
-    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+<a href="https://www.polyv.net/?f=git_DPlayer-20190518-02" target="_blank">
+    <img width="600px" src="https://i.loli.net/2019/06/03/5cf4028f7b8f716387.gif">
+</a>
+
+<a href="https://www.9ccms.net" target="_blank">
+    <img width="330px" src="https://i.imgur.com/YBV6kfb.png">
+</a>
+
+### Sponsors
+
+<a href="https://www.dogecloud.com/?ref=dplayer" target="_blank">
+    <img width="222px" src="https://i.imgur.com/BBKXPAp.png">
 </a>
 <a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
    <img width="222px" src="https://imgur.com/apG1uKf.png">
@ -64,8 +74,8 @@ const dp = new DPlayer({
 使用模块管理器:

 ```js
-import 'DPlayer/dist/DPlayer.min.css';
-import DPlayer from 'DPlayer';
+import 'dplayer/dist/DPlayer.min.css';
+import DPlayer from 'dplayer';

 const dp = new DPlayer(options);
 ```
--- a/docs/zh-Hans/ecosystem.md
+++ b/docs/zh-Hans/ecosystem.md
@ -48,6 +48,7 @@ search: zh-Hans

 ## 谁在用 DPlayer?

+- [学习强国](https://itunes.apple.com/cn/app/%E5%AD%A6%E4%B9%A0%E5%BC%BA%E5%9B%BD/id1426355645?mt=8): “学习强国”学习平台精心打造的手机客户端
 - [小红书](https://www.xiaohongshu.com/): 中国最大的生活社区分享平台，同时也是发现全球好物的电商平台
 - [极客时间](https://time.geekbang.org/): 极客邦科技出品的一款 IT 内容知识服务 App
 - [嘀哩嘀哩](http://www.dilidili.wang/): 兴趣使然的无名小站（D站）
--- a/docs/zh-Hans/support.md
+++ b/docs/zh-Hans/support.md
@ -20,7 +20,6 @@ DPlayer 是采用 MIT 许可的开源项目，使用完全免费。 但是随着
 - [微信支付](https://i.imgur.com/aq6PtWa.png)
 - [支付宝](https://i.imgur.com/wv1Pj2k.png)
 - [Paypal](https://www.paypal.me/DIYgod)
- 比特币: 13CwQLHzPYm2tewNMSJBeArbbRM5NSmCD1

 ## 周期性赞助

@ -31,10 +30,20 @@ DPlayer 是采用 MIT 许可的开源项目，使用完全免费。 但是随着

 ## 当前的顶级赞助商

-### 特别赞助商
+## Special Sponsors

-<a href="https://pear.hk/" target="_blank">
-    <img width="222px" src="https://i.imgur.com/5qQYmfc.png">
+<a href="https://www.polyv.net/?f=git_DPlayer-20190518-02" target="_blank">
+    <img width="600px" src="https://i.loli.net/2019/06/03/5cf4028f7b8f716387.gif">
+</a>
+
+<a href="https://www.9ccms.net" target="_blank">
+    <img width="330px" src="https://i.imgur.com/YBV6kfb.png">
+</a>
+
+### Sponsors
+
+<a href="https://www.dogecloud.com/?ref=dplayer" target="_blank">
+    <img width="222px" src="https://i.imgur.com/BBKXPAp.png">
 </a>
 <a href="https://console.upyun.com/register/?invite=BkLZ2Xqob" target="_blank">
    <img width="222px" src="https://imgur.com/apG1uKf.png">
--- a/package.json
+++ b/package.json
@ -30,35 +30,36 @@
  },
  "homepage": "https://github.com/DIYgod/DPlayer#readme",
  "devDependencies": {
-    "art-template": "4.12.2",
+    "@babel/core": "^7.4.5",
+    "@babel/preset-env": "^7.4.5",
+    "art-template": "4.13.2",
    "art-template-loader": "1.4.3",
-    "autoprefixer": "^8.6.2",
-    "babel-core": "^6.26.3",
-    "babel-loader": "^7.1.4",
-    "babel-preset-env": "^1.7.0",
+    "autoprefixer": "^9.6.0",
+    "babel-loader": "^8.0.6",
    "cross-env": "^5.2.0",
-    "css-loader": "^0.28.11",
-    "eslint": "^4.19.1",
-    "eslint-loader": "^2.0.0",
+    "css-loader": "^2.1.1",
+    "cssnano": "^4.1.10",
+    "eslint": "^5.16.0",
+    "eslint-loader": "^2.1.2",
    "exports-loader": "^0.7.0",
-    "file-loader": "^1.1.11",
+    "file-loader": "^4.0.0",
    "git-revision-webpack-plugin": "^3.0.3",
-    "mini-css-extract-plugin": "0.4.0",
-    "node-sass": "^4.9.0",
-    "postcss-loader": "^2.1.5",
-    "sass-loader": "^7.0.3",
+    "mini-css-extract-plugin": "0.7.0",
+    "node-sass": "^4.12.0",
+    "postcss-loader": "^3.0.0",
+    "sass-loader": "^7.1.0",
    "strip-loader": "^0.1.2",
-    "style-loader": "^0.21.0",
+    "style-loader": "^0.23.1",
    "svg-inline-loader": "0.8.0",
-    "template-string-optimize-loader": "^2.2.3",
-    "url-loader": "^1.0.1",
-    "webpack": "^4.12.0",
-    "webpack-cli": "3.0.4",
-    "webpack-dev-server": "^3.1.4"
+    "template-string-optimize-loader": "^3.0.0",
+    "url-loader": "^2.0.0",
+    "webpack": "^4.33.0",
+    "webpack-cli": "3.3.2",
+    "webpack-dev-server": "^3.6.0"
  },
  "dependencies": {
-    "axios": "0.18.0",
+    "axios": "0.19.0",
    "balloon-css": "^0.5.0",
-    "promise-polyfill": "8.0.0"
+    "promise-polyfill": "8.1.0"
  }
 }
--- a/src/js/controller.js
+++ b/src/js/controller.js
@ -91,7 +91,7 @@ class Controller {
            });

            this.player.on('loadedmetadata', () => {
-                this.thumbnails.resize(160, this.player.video.videoHeight / this.player.video.videoWidth * 160);
+                this.thumbnails.resize(160, this.player.video.videoHeight / this.player.video.videoWidth * 160, this.player.template.barWrap.offsetWidth);
            });
        }
    }
--- a/src/js/player.js
+++ b/src/js/player.js
@ -564,6 +564,9 @@ class DPlayer {
        if (this.danmaku) {
            this.danmaku.resize();
        }
+        if (this.controller.thumbnails) {
+            this.controller.thumbnails.resize(160, this.video.videoHeight / this.video.videoWidth * 160, this.template.barWrap.offsetWidth);
+        }
        this.events.trigger('resize');
    }

--- a/src/js/thumbnails.js
+++ b/src/js/thumbnails.js
@ -6,10 +6,11 @@ class Thumbnails {
        this.events = options.events;
    }

-    resize (width, height) {
+    resize (width, height, barWrapWidth) {
        this.container.style.width = `${width}px`;
        this.container.style.height = `${height}px`;
        this.container.style.top = `${-height + 2}px`;
+        this.barWidth = barWrapWidth;
    }

    show () {
--- a/src/js/utils.js
+++ b/src/js/utils.js
@ -48,7 +48,7 @@ const utils = {
    * getBoundingClientRect 在 Opera 10.5 及以下返回的值缺失 width、height 值
    */
    getBoundingClientRectViewLeft (element) {
-        const scrollTop = document.documentElement.scrollTop;
+        const scrollTop = window.scrollY || window.pageYOffset || document.body.scrollTop + (document.documentElement && document.documentElement.scrollTop || 0);

        if (element.getBoundingClientRect) {
            if (typeof this.getBoundingClientRectViewLeft.offset !== 'number') {
--- a/webpack/dev.config.js
+++ b/webpack/dev.config.js
@ -45,7 +45,7 @@ module.exports = {
                        loader: 'babel-loader',
                        options: {
                            cacheDirectory: true,
-                            presets: ['env']
+                            presets: ['@babel/preset-env']
                        }
                    }
                ]
--- a/webpack/postcss.config.js
+++ b/webpack/postcss.config.js
@ -1,5 +1,6 @@
 module.exports = {
    plugins: {
-        'autoprefixer': {}
+        'autoprefixer': {},
+        'cssnano': {}
    }
 };
--- a/webpack/prod.config.js
+++ b/webpack/prod.config.js
@ -48,8 +48,8 @@ module.exports = {
                    {
                        loader: 'babel-loader',
                        options: {
-                            compact: true,
-                            presets: ['env']
+                            cacheDirectory: true,
+                            presets: ['@babel/preset-env']
                        }
                    }
                ]
@ -62,7 +62,6 @@ module.exports = {
                        loader: 'css-loader',
                        options: {
                            importLoaders: 1,
-                            minimize: true,
                            sourceMap: true
                        }
                    },
--- a/yarn.lock
+++ b/yarn.lock