SVG的暗模式+亮模式

时间:2019-08-25 02:55:40

标签: javascript html css

我用深色模式和浅色模式启动了一个博客,但是问题是启用深色模式时,我转到下一页,它返回默认版本!

1。如何修复该功能以保持先前的选择?

2。如何更改新模式的SVG路径?

我将使用纯svg路径,如下所示:

<body id="darkoption" class="darkmode">
 <div>
  <a onclick="toggleDarkLight()">
   <svg class="sunmoon" viewBox="0 0 800 800">
    <path d="M595,282 C595,160 526,52 421,0 C466,52 495,122 495,197 C495,367 358,504 187,504 C117,504 51,480 0,438 C54,534 158,600 276,600 C452,600 595,459 595,282 Z M301,125 C223,128 184,169 184,241 C181,166 139,124 66,125 C137,124 185,86 184,8 C185,90 235,125 301,125 Z M409,280 C370,280 348,301 348,339 C347,300 325,278 287,280 C323,278 350,258 348,217 C350,261 375,280 409,280 Z M166,351 C138,351 123,366 123,392 C122,364 107,349 80,351 C105,349 124,335 123,307 C124,338 141,351 166,351 Z">
    </path>
   </svg>
  </a>
 </div>

这是JS代码:

 function toggleDarkLight() {
   var e = document.getElementById("darkoption"),
   a = e.className;
   e.className = "darkmode" == a ? "lightmode" : "darkmode"
}

0 个答案:

没有答案