The instructions in this article assume that you’ve installed the latest version of Windows 10 - version 20H2, a.k.a. As I’ll show you, it only takes a few minutes. Whatever the reason, if Edge is your default Windows 10 browser, it’s easy to switch to the browser of your choice. When there’s a major Windows 10 upgrade, the upgrade recommends switching to Edge, and you might have inadvertently made the switch. Note that even if you’ve previously set up another browser to be your default, it might have been changed since then. But you might still prefer to use Chrome, Firefox, or one of the many other browsers out there. The new Edge is a much better browser, and there are compelling reasons to use it. The original version of Edge was underpowered, had difficult-to-use features, and offered very few extensions compared to Chrome and Firefox.īut in January 2020, Microsoft launched a new version of Edge that’s based on the same technologies that drive Chrome. Even though the company made Edge the default browser in Windows 10, users left in droves, most of them flocking to Google Chrome - and with good reason. The app.css source file uses the titlebar-area-* CSS environment variables.Microsoft has been struggling to get people to use its Edge browser for years. The app.js source file uses the navigator.windowControlsOverlay object. The manifest.json source file declares the app's use of the Window Controls Overlay feature. The source code for this demo app is in the 1DIV repo. The top area of the app is a drag handler, to let users move the window. The app now displays content all the way to the top of the window frame, where the title bar used to be. In Microsoft Edge, go to 1DIV and install the app.Ĭlick Hide title bar in the app title bar. To do this, in the manifest file, set the display_override property: px`) ġDIV is a PWA demo app that uses the Window Controls Overlay feature. The first thing to do is to enable the Window Controls Overlay feature in your app's Web App Manifest file. Makes it possible for your content to stay clear of this overlay.Įnable the Window Controls Overlay in your app.Moves the critical system-required window controls into an overlay.Allows you to display web content over the entire surface area of the app.The Window Controls Overlay API does the following: Many desktop applications, such as Visual Studio Code, Microsoft Teams, and Microsoft Edge already do this: However, to create an immersive, native-like experience, desktop PWAs can use another approach.īy default, a PWA installed on desktop can display content in an area that starts immediately below the reserved title bar area:ĭisplaying content where the title bar normally is can help PWAs feel more native. A PWA can define how it should be displayed on mobile platforms, by using the display member in the web app manifest file.
0 kommentar(er)
