我有一個動畫進度條，在我的 Js 代碼中我有一個百分比數字變量Puverg，如何更新進度條以具有與百分比數字相同的進度？var x = setInterval(function() { var now = new Date().getTime(); var distance=countDownDate-now; var vergangen=intervall-distance; var Puverg=(vergangen/intervall)*100; var Puebrig=100-Puverg;}, 1000);@import url("https://fonts.googleapis.com/css?family=Montserrat&display=swap");body{ font-family:Montserrat, sans-serif; background: black; color: white;}.container{ margin: 100px auto; margin-top: 330px; width: 400px; text-align: center; position: relative;}.progress2{ border-radius: 30px; background-color: #fff;}.progress-bar2{ height: 18px; border-radius: 30px; transition: 0.4s linear; transition-property: width,background-color;}.progress-moved .progress-bar2{ background-color:#f3c623; animation: progress 5s infinite;}@keyframes progress{ 0%{ width:0%; background:#f9bcca; } 100%{ width:100%; background:#f3c623; box-shadow: 0 0 40px #f3c623; }}.icon{ color:#f3c623; animation: icon 5s infinite; background-color: transparent; padding-right: 400px; padding-bottom: 20px;}@keyframes icon{ 0%{ opacity: .2; text-shadow: 0 0 0 #f3c623; } 100%{ opacity: 1; text-shadow: 0 0 10px #f3c623; }}.loader{ --p:0; animation: p 5s steps(100) infinite; counter-reset: p var(--p); font-size: 2.1em; position: absolute; bottom: 45px; left: 325px; color:#f3c623;}.loader::after{ content: counter(p) "%";}@keyframes p{ 90%,100%{ --p: 100; }}
用百分比數字更新進度條？
呼啦一陣風
2023-10-20 16:22:13
