Om Carvers Corner.se konstigt fel. Psykbryt?

[SeniorLemuren]

Testade på mobilen i safari.
Alla dropdown-menyer hamnar bakom de svarta mörkbruna knapparna.
För varje val jag gör nollställs alla andra fält.
Stående syns inte skylten alls.
Liggande ser det ut såhär
B6DAFBE5-2E1C-4921-ACE8-2CA69914D30E.png

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.

[Henry]

Att flytta texten funkar fint för mig, men ett förslag är en funktion som om man håller nere en pilknapp så efter tex en halv sekund så flyttas texten istället exempelvis 10 ggr snabbare automatiskt åt det hållet.

[MadModder]

Man skall emellertid inte klicka på dem, de öppnas vid "onmouseover".

Det är lite svårt med pekskärm att inte klicka på det man pekar på.

[SeniorLemuren]

Haha, ja det är lite klurigt. Just rullgardinsmenyn är ju en färdig funktion med vidhängande CSS så jag får leta reda på den i Bootstraps CSS-fil och ändra den till click.

[SeniorLemuren]

Att flytta texten funkar fint för mig, men ett förslag är en funktion som om man håller nere en pilknapp så efter tex en halv sekund så flyttas texten istället exempelvis 10 ggr snabbare automatiskt åt det hållet.

Ja det är ett bra sätt att lösa det. Jag har nosat lite på en sådan rutin. Kommer inom kort.

[rvl]

Skylten täcker delvis instruktionstexten. Kanske inte intuitivt att texterna börjar hoppa omkring, när man håller på att skriva in dem och focus är i nåt av inputfälten.

Screenshot 2022-03-09 195117.png

[BallInPlay]

Skärmbild 2022-03-09 200935.png

Windows 10 , Chrome Version 98.0.4758.102 (Officiell version) (64 bitar)

[MadModder]

Träbiten är placerad med ett fast avstånd från vänsterkanten.
Sätt den istället i en DIV till höger om reglagen.

[SeniorLemuren]

Skärmbild 2022-03-09 200935.png
Windows 10 , Chrome Version 98.0.4758.102 (Officiell version) (64 bitar)

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?
Tack för din input.

[SeniorLemuren]

Träbiten är placerad med ett fast avstånd från vänsterkanten.
Sätt den istället i en DIV till höger om reglagen.

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.

(I koden visas alla img id=.. men bara den man klickar på visas på skärmen via CSS.)
Kolla denna version, där jag satt text och skylt till relative. Trixet är ju hur man låser skylt och text att ändra style.top inom sin div att ändra sig.

Kanske jag måste lösa detta i javascriptet genom att addera subtrahera style.top med fontens storlek? Eller finns det något att göra åt problemet i CSS.

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>

[rvl]

Det tar sig...

Defaultstorleken när man inte valt storlek är jäkla stor.
Hela skylten flyttar sig nedåt för varje påbörjad textrad!

[MadModder]

Men om du sätter skylten som relative, och texten i varsin child DIV med absolute borde texten sitta fast på skylten som kan flytta sig.

[SeniorLemuren]

Testat ditt tips, texten flyttar på skylten i förhållandet till teckenhöjden. Kolla

[MadModder]

Nja... jag menade att förälder-DIVen ska ha skylten som bakgrund, och inte ligga som ett objekt i samma nivå som den DIV som text ligger i.

<div träbit>
   <div textrad 1></div>
   <div textrad 2></div>
</div>

så de verkligen är inuti skylt-diven.
Det ska gå att sätta DIV-typen som tabellceller, så de håller sig på plats.

[Lennart Aspenryd]

Jag tyckte det var busenkelt att skriva och förflytta två rader när man hade gjort alla andra val.
Kanske skall det finnas en förflyttningspiltavla liksom i CNC programmen.
Kommer det fonter och spara funktion som håller reda på "mina" beställningar?