diff --git a/public/osdlyrics.html b/public/osdlyrics.html
index f45c577..deba7ce 100644
--- a/public/osdlyrics.html
+++ b/public/osdlyrics.html
@@ -14,6 +14,7 @@
             padding: 0px;
             -webkit-user-select: none;
             -webkit-app-region: drag;
+            background: rgba(0, 0, 0, 0.000);
         }
 
         div {
@@ -25,7 +26,7 @@
     </style>
     <title>OSD Lyrics</title>
     <script>
-        const electron = process && process.versions && process.versions.hasOwnProperty('electron') ? window.require('electron') : null;
+        const electron = (typeof navigator === 'object' && typeof navigator.userAgent === 'string' && navigator.userAgent.indexOf('Electron') >= 0) ? window.require('electron') : null;
         const ipcRenderer = electron ? electron.ipcRenderer : null;
         const player_api = window.location.origin + "/player";
         const lyrics_api = window.location.origin + "/api/lyric?id=";
diff --git a/src/components/Player.vue b/src/components/Player.vue
index 3241bfa..ffe64f9 100644
--- a/src/components/Player.vue
+++ b/src/components/Player.vue
@@ -96,11 +96,8 @@
         <div class="blank"></div>
         <div class="container" @click.stop>
           <button-icon
+            v-if="osdState"
             :title="$t('player.osdlyrics')"
-            :class="{
-              active: osdState,
-              disabled: !osdState,
-            }"
             @click.native="toggleOSDLyrics"
             ><svg-icon icon-class="osd-lyrics"
           /></button-icon>
@@ -215,7 +212,7 @@ export default {
         : '';
     },
     osdState() {
-      return true; //this.$store.osdlyrics.show || false;
+      return Boolean(ipcRenderer);
     },
   },
   methods: {