BananaMaster

10 - Das onchange-Ereignis bei input type range ( Arbeiten mit style width und height in JavaScript )

Falls du etwas vergessen hast — klicke, um zur Lektion zurückzukehren.

Task 1.

Erstelle ein input mit type="range" und einen Button. Beim Klick auf den Button wird in der Konsole der vom Benutzer gewählte Wert unseres inputs ausgegeben.

Task 2.

Erstelle ein input mit dem Typ type="range" und einen Button. Der Benutzer soll mit dem Schieberegler einen Wert wählen können. Beim Klick auf den Button muss die Breite des Buttons (Eigenschaft width) entsprechend dem im input gewählten Wert geändert werden.

Task 3.

Erstelle ein input mit type="color" und einen Button. Ändere bei Änderung des Reglerwerts den Hintergrund des Buttons in Echtzeit. ( style.background )

Task 4.

Erstelle ein input mit dem Typ type="range" und ein div. Gib bei Änderung des Reglerwerts in Echtzeit den gewählten Wert innerhalb des divs aus.

Task 5.

Erstelle zwei input type="range" (height und width) und ein input type="color" (background). Ändere bei Änderung der Werte in Echtzeit Größe und Farbe des Buttons. (onchange)

Task 6.

Erstelle ein input mit type="number" und einen Button. Ändere beim Klick auf den Button die Breite des Buttons entsprechend der im input angegebenen Zahl.