Starten Sie einen transparenten Browser, um das Erlebnis von Webanwendungen und PWA zu verbessern [unterstützt statisches HTML, CSS und JavaScript] [Benutzern die Anzeige von Desktop-Hintergründen in unseren Webanwendungen/PWA ermöglichen]

Question

Ich bin ein Junior-Frontend-Entwickler und Designer, der derzeit eine Webanwendung (Chat) mit Sockets entwickelt.

Die Sprachen, die meine Freunde und ich verwenden, sind: Scala, HTML, CSS, JavaScript.

Ich arbeite an HTML, CSS und JavaScript. Er benutzt Scala.

Ich muss eine App mit transparentem Browser/Hintergrund erstellen, so dass wir den Desktop-Hintergrund über unsere App oder Website sehen können.

Ich habe gehört, dass wir das Electron-Framework verwenden können, um diesen Prozess zu vereinfachen. Aber ich bleibe irgendwie dabei, statisches JS zu verwenden.

Also Leute, bitte helft mir.

Ist es möglich, eine browserbasierte Progressive Web App (PWA) zu erstellen, die eine transparente Oberfläche bietet, über die Benutzer ihr Desktop-Hintergrundbild über die App sehen können?

Answer 1

您无法控制Web浏览器窗口的透明度，因此如果此应用程序在实际的浏览器中（而不是Electron），则不可能实现。

然而，在Electron中是可能的，而且非常简单：

const { BrowserWindow } = require('electron');

const window = new BrowserWindow({
  width: 800, 
  height: 600,
  transparent:true,  // <-- 这部分
});