☰

Transparent Navigation Bar

Transform supported site's navigation bar into an acrylic nav bar.

如何安装

您需要先安装一个扩展，例如 篡改猴、Greasemonkey 或 暴力猴，之后才能安装此脚本。

您需要先安装一个扩展，例如 篡改猴 或 暴力猴，之后才能安装此脚本。

您需要先安装一个扩展，例如 篡改猴 或 暴力猴，之后才能安装此脚本。

您需要先安装一个扩展，例如 篡改猴 或 Userscripts ，之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展，例如 Tampermonkey，才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

（我已经安装了用户脚本管理器，让我安装！）

如何安装

您需要先安装一款用户样式管理器扩展，比如 Stylus，才能安装此样式。

您需要先安装一款用户样式管理器扩展，比如 Stylus，才能安装此样式。

您需要先安装一款用户样式管理器扩展，比如 Stylus，才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

（我已经安装了用户样式管理器，让我安装！）

作者
ShingZhanho
日安装量
0
总安装量
186
评分
1 0 0
版本
0.1.0.3
创建于
2021-04-22
更新于
2021-04-25
大小
4.1 KB
许可证
暂无
适用于
所有网站

transparent-nav.js

What is this?

A tampermonkey user script which generates webpages' navigation bar to acrylic-material.

How to use?

  1. To use user scripts, you will need a browser extension that executes GreasyFork scripts. These are the common extensions for different browsers:
  2. Once you installed the extension, you can click here to install this user script. Make sure you enable the script so that the script can run on different websites.
  3. Encounters problems? Don't hesitate to ask on the discussion page!

Showcase

Checkout the examples:

Effect preview 1 Effect preview 2

Compatibility

The transparent effects rely on the backdrop-filter property of css. Thus, your browser need to support that property. Please note that Firefox does not support backdrop-filter by default, you may need to enable that option manually.

Supported Websites

Here are the supported websites of this script:

Website Name URL Remarks
Cambridge Dictionary dictionary.cambridge.org
Google Classroom classroom.google.com
Google Search www.google.*/search This applies to all area's Google search, i.e. www.google.co.uk, www.google.com.hk etc.
UK Royal Family Website www.royal.uk
W3Schools www.w3schools.com
YouTube www.youtube.com