html Änderung

This commit is contained in:
Pupsmuckel 2021-06-24 13:41:20 +02:00
parent bb3a735d37
commit 7976f5258f
2 changed files with 33 additions and 28 deletions

View File

@ -15,47 +15,50 @@
<div class="ueberschrift"> <div class="ueberschrift">
Helligkeit Helligkeit
<!--<label id="label_pwm"> <!--<label id="label_pwm">
</label>--> </label>-->
<div class="slider"> <div class="slider">
<input type="range" class="regler" value="50" min="1" max="100" <input type="range" class="regler" id="helligkeit" name="rangeInput" min="0" max="100" value="50"
oninput="this.nextElementSibling.value = this.value"> oninput="amount1.value=helligkeit.value">
<br>
<output>50</output> <output name="amount1" id="amount1" for="helligkeit">50</output>
</div> </div>
</div> </div>
<div class="ueberschrift"> <div class="ueberschrift">
Helligkeit bei Dunkelheit Helligkeit bei Dunkelheit
<!--<label id="label_pwm_dark"> <!--<label id="label_pwm_dark">
</label>--> </label>-->
<div class="slider"> <div class="slider">
<input type="range" class="regler" value="50" min="1" max="100" <input type="range" class="regler" id="helligkeit_dunkel" name="rangeInput" min="0" max="100" value="50"
oninput="this.nextElementSibling.value = this.value"> oninput="amount2.value=helligkeit_dunkel.value">
<output>50</output> <br>
</div> <output name="amount2" id="amount2" for="helligkeit_dunkel">50</output>
</div>
</div> </div>
<div class="ueberschrift"> <div class="ueberschrift">
Laufgeschwindigkeit Laufgeschwindigkeit
<!--<label id="label_geschwindigkeit"> <!--<label id="label_geschwindigkeit">
</label>--> </label>-->
<div class="slider"> <div class="slider">
<input type="range" class="regler" value="50" min="1" max="100" <input type="range" class="regler" id="geschwindigkeit" name="rangeInput" min="0" max="100" value="50"
oninput="this.nextElementSibling.value = this.value"> oninput="amount3.value=geschwindigkeit.value">
<output>50</output> <br>
</div> <output name="amount3" id="amount3" for="geschwindigkeit">50</output>
</div> </div>
</div>
<div class="ueberschrift"> <div class="ueberschrift">
Licht-An-Zeit Licht-An-Zeit
<!-- <label id="label_time"> <!-- <label id="label_time">
</label>--> </label>-->
<div class="slider"> <div class="slider">
<input type="range" class="regler" value="50" min="1" max="100" <input type="range" class="regler" id="time" name="rangeInput" min="0" max="100" value="50"
oninput="this.nextElementSibling.value = this.value"> oninput="amount4.value=time.value">
<output>50</output> <br>
<output name="amount4" id="amount4" for="time">50</output>
</div> </div>
</div> </div>
</body> </body>

View File

@ -24,9 +24,11 @@ html {
} }
.regler{ .regler{
position: fixed;
left: 0;
-webkit-appearance: none; -webkit-appearance: none;
height: 30px; height: 30px;
width: 98%; width: 100%;
border-radius: 20px; border-radius: 20px;
outline: black; outline: black;
background-color: rgb(176, 188, 228); background-color: rgb(176, 188, 228);