x15904151985/ArtPlayer
1
0 Fork 0
mirror of https://github.com/zhw2590582/ArtPlayer.git synced 2026-10-24 23:51:20 -08:00
Code Issues Packages Projects Releases Wiki Activity

添加背景模糊特效

Browse Source
This commit is contained in:
Harvey committed 2019-09-12 16:33:21 +08:00
1 parent da69b19b63
commit 18ca81e2ed
19 files changed
+18 -292
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/artplayer/src/style/artplayer.scss
+8
View File
@@ -45,4 +45,12 @@
pointer-events: none;
z-index: -1;
}
@supports ((-webkit-backdrop-filter: initial) or (backdrop-filter: initial)) {
.artplayer-backdrop-filter {
-webkit-backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px);
background-color: rgba(0, 0, 0, 0.7) !important;
}
}
}
packages/artplayer/src/template.js
+3 -3
View File
@@ -41,11 +41,11 @@ export default class Template {
<div class="artplayer-notice-inner"></div>
</div>
<div class="artplayer-setting">
<div class="artplayer-setting-inner">
<div class="artplayer-setting-inner artplayer-backdrop-filter">
<div class="artplayer-setting-body"></div>
</div>
</div>
<div class="artplayer-info">
<div class="artplayer-info artplayer-backdrop-filter">
<div class="artplayer-info-panel"></div>
<div class="artplayer-info-close">[x]</div>
</div>
@@ -53,7 +53,7 @@ export default class Template {
<div class="artplayer-pip-title"></div>
<div class="artplayer-pip-close">×</div>
</div>
<div class="artplayer-contextmenu"></div>
<div class="artplayer-contextmenu artplayer-backdrop-filter"></div>
</div>
`;
this.$player = this.$container.querySelector('.artplayer-video-player');