Every day, web developers work to optimize their designs with modern features, many of which may not be readily available on all viewing platforms. On this page you'll find the (experimental) fruits of some of the code found on CompCADEMY's very own website. Keep in mind that some of these features may still contain bugs as they are still in development.
The new Frosted Glass design implements the graphical effects characteristic of the design theme of Apple's latest builds of iOS and Mac OS X, as well as Microsoft's "Fluent Design" effects included in the latest builds of Windows 10. If compatible with your browser, this blurred transparency effect can be seen in the navigation bar found at the head of each CompCADEMY web page, as well as the dropdown menu that cascades from it when viewed in a mobile web browser.
This is a GUI feature that invokes the newly introduced
backdrop-filter
CSS attribute. Currently, only
WebKit, the rendering engine on which Google Chrome
(Chromium), Opera, and Apple Safari are based, supports
this attribute. Microsoft Edge for Windows 10 build 17093
(currently available on the Fast Ring under the Windows
Insider Program) also supports this feature.
Although Chrome/Chromium and Opera provide inbuilt support for this attribute, it is not enabled out-of-the-box. To enable it, you will need to go to chrome://flags, search for Experimental Web Platform features, and select Enabled in the corresponding dropdown box. Restart your browser and go to our homepage, and you should see the effects.
For more information, please see the
Mozilla
Developer Network article on the
backdrop-filter
attribute.
Known issues: