1
HTML + CSSEingabefelder

Mengenwähler mit Schiebezahl

Plus- und Minus-Buttons um eine Zahl, die beim Ändern von oben oder unten hereingleitet.

Einstellungen

16px
1x

Code

<div class="uv-in2q"><button class="mn">−</button><span class="nm"><b>1</b></span><button class="pl">+</button></div>

Prompt für KI

Füg ihn in ChatGPT, Claude oder Cursor ein und der Baustein wird mit diesen Einstellungen an dein Projekt angepasst, auch ohne React.

Mehr aus Eingabefelder

Wofür du ihn nutzen kannst

Eine Mengenauswahl gehört neben alles, was man mehrfach kauft: den Warenkorb eines Onlineshops, Tickets für ein Konzert oder die Anzahl der Gäste bei einer Tischreservierung. Die Zahl rollt beim Erhöhen nach oben und beim Verringern nach unten, und Minus schaltet sich bei eins ab. Ein Mengen-Stepper in HTML, CSS und etwas JavaScript.

Die Demo endet bei 99. Stell das Maximum auf deinen echten Lagerbestand, damit niemand mehr bestellt, als du liefern kannst. Die Buttons sind rund und groß genug für Finger, verkleinere sie am Handy also nicht.