Svenskt forum för elektroniksnack.
https://elektronikforumet.com/forum/
Ja det ser ju hetokigt ut. Anledningen till att allt nollställs om man klickar på valknapparna har jag inte hittat ännu. Det ligger i CSS någonstans. Man skall emellertid inte klicka på dem, de öppnas vid "onmouseover". Skall ändra detta så att man måste klicka i stället.
Det är lite svårt med pekskärm att inte klicka på det man pekar på.SeniorLemuren skrev: ↑9 mars 2022, 13:18:16Man skall emellertid inte klicka på dem, de öppnas vid "onmouseover".
Ja det är ett bra sätt att lösa det. Jag har nosat lite på en sådan rutin. Kommer inom kort.
Ja, det är skylten som ställer till problemet. Jobbar på det. Men det vore intressant att se hur sidan ser ut om du väljer storlek på bilden före innan du öppnar själva skylten. I bilden du visar har du inte valt storlek verkar det som?BallInPlay skrev: ↑9 mars 2022, 20:10:44 Skärmbild 2022-03-09 200935.png
Windows 10 , Chrome Version 98.0.4758.102 (Officiell version) (64 bitar)
Japp, så är det gjort, se koden, men jag har satt img till position absolute i CSS. Om jag sätter texten och skylten till relative inom sina divar (länk till sidan) så kommer textraderna class="mytext1" och class="mytext2" att flytta på skylten ned eller upp varefter man förminskar eller förstorar texten.
Kod: Markera allt
<div class="col-lg-4">
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="">Text rad 1</span>
</div>
<input id="container1" type="text" value="" oninput="changeSize1()">
<span class="slider1txt">Ändra textstorlek:</span><input class="slider1" type="range" min="10" max="100" id="slider1" onchange="changeSizeBySlider1()" value="1" />
</div><br>
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="">Text rad 2</span>
</div>
<input id="container2" type="text" value="" oninput="changeSize2()"><br>
<span class="slider2txt">Ändra textstorlek:</span><input class="slider2" type="range" min="10" max="100" id="slider2" onchange="changeSizeBySlider2()" value="1" /><br><br>
</div>
<span class="infotxt">Klicka på skylten och sedan på siffra 0 för att flytta övre texten eller siffra 1 för att flytta undre texten, använd sedan Pilarna för att flytta texten i små steg eller siffrorna vänster=4,höger=6,upp=8,ned=2 för att flytta texten med stora steg. </span>
</div>
<div class="col-lg-8">
<p id="textrad1" class="mytext1"></p>
<p id="textrad2" class="mytext2"></p>
<img id="image1" class="skyltbox" src="assets/img/framesharpcorner.jpg" alt="framesharpcorner" />
<img id="image2" class="skyltbox" src="assets/img/framerounnegcorner.jpg" alt="framerounnegcorner" />
<img id="image3" class="skyltbox" src="assets/img/framerounposcorner.jpg" alt="framerounposcorner" />
<img id="image4" class="skyltbox" src="assets/img/noframe.jpg" alt="noframe" />
</div>
<div träbit> <div textrad 1></div> <div textrad 2></div> </div>
