-
-
Save izfsk-ium/4179ab35abc095deeece61cec560fe07 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>My Website</title> | |
| <style> | |
| html { | |
| background-image: url(https://w.wallhaven.cc/full/we/wallhaven-wex3l7.jpg); | |
| background-size: cover; | |
| } | |
| h1 { | |
| color: white; | |
| text-align: center; | |
| text-shadow: 0 0 10px black; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>右上角有亮度控制条 | |
| <br> | |
| 油猴脚本下载地址： | |
| <a href="https://openuserjs.org/scripts/kasusa/night_bar ">openuserjs</a> | |
| </h1> | |
| </body> | |
| <script> | |
| document.addEventListener('DOMContentLoaded', function () { | |
| const a = document.body.appendChild(document.createElement("div")); | |
| a.innerHTML = | |
| ` | |
| <style> | |
| #brightness-cover { | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background-color: rgba(0, 0, 0); | |
| z-index: 999; | |
| opacity: 0; | |
| pointer-events:none; | |
| } | |
| #brightness-controlbox{ | |
| position: fixed; | |
| background-color: rgba(0, 0, 0, 0.5); | |
| border-radius: 0 0 0 10px; | |
| padding: 5px; | |
| top: 0px; | |
| right: 0px; | |
| z-index: 1000; | |
| opacity: .0; | |
| transform: translateY(-90%); | |
| } | |
| #brightness-controlbox:hover{ | |
| opacity: 1; | |
| transform: translateY(0%); | |
| } | |
| </style> | |
| <div id="brightness-cover"> | |
| </div> | |
| <div id="brightness-controlbox" > | |
| <input type="range" min="0" max="65" value="0" class="slider" id="brightness-Range"> | |
| </div> | |
| ` | |
| let slider = document.getElementById("brightness-Range"); | |
| let output = document.getElementById("demo"); | |
| slider.oninput = function () { | |
| document.querySelector("#brightness-cover").style = "opacity: " + this.value + "%"; | |
| localStorage.setItem(`Config-${location.href}`, this.value ?? 0); | |
| } | |
| const siteConfigure = localStorage.getItem(`Config-${location.href}`); | |
| let siteConfiguredValue = 0; | |
| if (siteConfigure != null) { | |
| siteConfiguredValue = parseInt(siteConfigure) ?? 0; | |
| } | |
| document.querySelector("#brightness-cover").style = "opacity: " + siteConfiguredValue + "%"; | |
| }); | |
| </script> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment