屏幕上的图像覆盖切换按钮

image overlay toggle button on screen

本文关键字:按钮 覆盖 图像 屏幕      更新时间:2023-09-26

所以我有这个图像代码css,它与一些HTML也工作。我想做的是有一个屏幕上的按钮,切换这个代码关闭或打开。这是为我的网站。我想让它默认是关闭的。另外,代码是否有可能记住用户的选择?比如如果用户想要叠加,然后转到另一个页面,我希望它能记住这个选择。对不起,我的儿子……我学习。

css

    div.nightmode {
      opacity:    0.05; 
      background: url(**image url**);  
      width:      100%;
      height:     100%; 
      z-index:    10;
      top:        0; 
      left:       0; 
      position:   fixed; 
      pointer-events: none;
 }
html

<body>
  <div class="nightmode"></div>
</body>

有两种方法。我认为最好的方法是使用饼干。这里有一个小例子:

click on DIV to toggle
https://jsfiddle.net/sdx2rba9/49/

after refresh page cookie set background to previous choice

不能在stackoverflow内置的jsfiddle (cookie- security)中发布。请记住:我不是高级程序员,所以我的代码可能不干净或写得很长。