Reines CSS – Persistenter Zustand in VariablenCSS

CSS verstehen
Guest
 Reines CSS – Persistenter Zustand in Variablen

Post by Guest »

Ich habe einige Variablen in meinem CSS-Blatt und möchte einen Zustand speichern (wäre eine Zahl).
Zum Beispiel möchte ich einen „fast“ unendlichen Zähler erstellen das würde sich bei jedem Klick erhöhen.
Das erste, was ich versucht habe (nach einigen Problemen mit vars und calcs), war die Verwendung eines Zählers und Keyframes mit Vorwärtsfüllmodus, aber bei jedem neuen Klick war der Zähler zurückgesetzt.
Code:

Code: Select all

@keyframes increment {
from {}
to   { counter-increment: count; }
}

#counter {
counter-reset: count;
}

#counter:active {
animation: increment forwards;
}

#counter::after {
content: "Count: " counter(count);
}

Code: Select all

Add 1


Ich habe auch versucht, Kontrollkästchen und Optionsfelder zu verwenden, die funktionierten ( Sobald das Element den aktivierten Status erhält, wird die Anzeige auf „Keine“ gesetzt und das nächste wird angezeigt), aber es war ziemlich „begrenzt“ durch die Anzahl der Kontrollkästchen oder Radios.
Dann habe ich bin darauf gestoßen: https://medium.com/@alexc73/state-in-css-ac57a1ebde09, das einen ziemlich ähnlichen Mechanismus verwendet, obwohl er für mich ziemlich fehlerhaft war (Firefox 134.0 64 Bit unter Windows 11).
Im letzten Teil der Frage geht es um die Verwendung des als Variable gespeicherten Zustands (z. B. in einer Berechnung), aber ich habe keine Möglichkeit gefunden, einen Zähler als Variable zu verwenden Variable.
Ich möchte also fragen, ob jemand bereits auf ein ähnliches Problem gestoßen ist und ob es eine Lösung (sogar einen Hack) gibt.

Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post
  • Reines CSS – Persistenter Zustand in Variablen
    by Guest » » in HTML
    0 Replies
    3 Views
    Last post by Guest
  • Kombinieren Sie CSS -Variablen zu einer Variablen
    by Anonymous » » in CSS
    0 Replies
    3 Views
    Last post by Anonymous
  • CSS -Verhalten je nach Zustand eines anderen Elements
    by Guest » » in HTML
    0 Replies
    3 Views
    Last post by Guest
  • CSS -Verhalten je nach Zustand eines anderen Elements
    by Guest » » in CSS
    0 Replies
    9 Views
    Last post by Guest
  • Flüchtige Variablen und andere Variablen
    by Guest » » in Java
    0 Replies
    10 Views
    Last post by Guest