Rozložení tlačítek na obrazovce - rozdílné rozložení při stejném rozlišení na jiném počítači- ale st – CSS – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Rozložení tlačítek na obrazovce - rozdílné rozložení při stejném rozlišení na jiném počítači- ale st – CSS – Fórum – Programujte.comRozložení tlačítek na obrazovce - rozdílné rozložení při stejném rozlišení na jiném počítači- ale st – CSS – Fórum – Programujte.com

 

Dave2K0
Duch
2. 9. 2024   #1
-
0
-

Ahoj, 

rád bych požádal někoho zkušenějšího o radu. V zásadě jsem to již popsal v názvu přízpěvku a k tomu směřuje i múj dotaz, jestli je to vůbec možné, abych na jiněm stroji stejného modelu při nastavení stejného rozlišení měl odlišné rozložení tlačítek? Kdo by měl zájem mohu poskytnout ještě detailnější popis ale v zýsadě jde o to že jsem si vyladil zobrazení na svém laptopu na jedno rozlišení otestoval jsem to i na externím monitoru- vše vpořádku. 

Nahlásit jako SPAM
IP: 83.164.140.–
peter
~ Anonymní uživatel
4007 příspěvků
3. 9. 2024   #2
-
0
-

V zasade jsi nerekl vubec nic. To je pak tezke. Nadpis je prilis kratky a v textu, ac je dlouhy, je informaci pomalu :)

Ceho presne potrebujes docilit? Co znamena rozlozeni tlacitek? Jak maji byt usporadana? Stacilo by ti pouzit bootstrap-css?

google = bootstrap css window size position buttons
https://bootstraptemple.com/…trap-buttons

google = bootstrap css buttons drag drop
https://mdbootstrap.com/…ag-and-drop/
nadpis treba Sortable basic example, zkus si tam tlacitka presunovat

google = bootstrap css buttons change position on click

https://peter.mlich.cz/
Kdyz si prepnes prohlizec na rezim okno a zacnes zuzovat rozmery, tak v urcite chvili leve menu odskoci a je nahore. To je podle mne, smena rozlozeni tlacitek.

Nebo potrebujes, aby si mohl uzivatel navolit rozlozeni tlacitek a ulozit mu tuto informaci to data-storage nebo cookies pro pristi pouziti? Nebo, pokud je prihlaseny, uloz mu to do databace k jeho profilu.

Nebo, kdysi jsem si udelal na webce nekolik rezimu zobrazeni stranky, kdy jsem premistoval menu nalevo, nahoru, do oblouku a pod. Stacilo jedno kliknuti na kolecku nastaveni a zmenil se vzhled i obrazky cele stranky. Je to sice cool, ale pro web neprakticke, vyznam ma mit svetly-tmavy rezim, pripadne minimalisticky pro mobily.

Takze, moznosti jsou. Kliknuti, zmena rozmeru okna, cookies a jeste mne napada treba v zavislosti na ruznem prohlizeci, Edge / Firefox. Otevres na pocitaci 2 ruzne prohlizece a do css nastavis podminku, ze se to v jednom zobrazi tak, v jinem jinak. To jde, vetsinou se takve chovani povazuje sis za bug.

Nahlásit jako SPAM
IP: 2001:718:2601:258:9927:9640:8558:95a7...–
peter
~ Anonymní uživatel
4007 příspěvků
3. 9. 2024   #3
-
0
-

"Ceho presne potrebujes docilit?"
Tim myslim to, jak jsou tlacitka usporadana nyni?
Jak maji byt usporadana v druhem pripade?
A jak si predstavujes, v zavislosti na cem, se ta poloha ma zmenit? (uzivatel, kliknuti, prohlizec... verze prohlizece)

A idealni je, kdyz se na to lidi nemusi ptat po zadani tematu. Ale, tak, i mne se to obcas povede nerict vlastne nic, z ceho muzou ostatni vychazet :) Jen je dobre se na dotaz podivat z pohledu treba tve mladsi sestry, zda by i ona pochopila, na co se ptas nebo, jestli mas nejake informace pouze ty v mysli a tak :)

Nahlásit jako SPAM
IP: 2001:718:2601:258:9927:9640:8558:95a7...–
Dave2K
~ Anonymní uživatel
10 příspěvků
3. 9. 2024   #4
-
0
-

#3 peter#3 peter
Ahoj, děkuji za odpovědi. Zkusím to popsat trochu jinak. Nachvíli úplně zapomeńte na klasické webovky. Je pouzit HTML, JS a CSS. Účel tohoto byl přiblížit grafické rozhraní stroje. Na obrazovce stroje vidíme nějaké grafické rozložení, jde o dotykový display takže kliknete na urcitý symmbol který představuje nějakou funkci pomocí které se dostanete na jiné rozhraní, grafické rozložení se změní a vy můžete v reálu něco nastavit a jít zase zpět do hlavní nabídky nebo do dalšího submenu atd. je to docela rozvětvené. Chtěl jsem zkusit naprogramovat něco co bude jenom simulovat chavání a logiku toho rozhraní. Takže jsem si udělal screeshoty vsech obrazovek interaktivitu jsem zajistil tak ze jsem ta tlacitka "nalepil" podle rozmisteni na obrazovce tak aby odpovídala realitě. Ještě jinak, předtavte si velké plátno na kterém budou nakresleny dva kruhy a dva čtverce. Já vezmu to plátno a udělám jeho přesnou kopii, z kopie vystřihnu pouze ty dva čtverce a dva kruhy a těmi přelepím kruhy a čtverce na tom původním plátně a to budou moje tlacítka. Takze pokud budu to platno chtit zobrazit na jinem pocitaci pri stejnem rozlisen i stejnem prohlizeci neboudou ty " nalepena" tlacitka odpovidat originalnim pozicim. Snažil jsem se a i tak to zní dost kostrbatě a omlouvám se za to. Je to i dost nestandartní použití takže se dost složitě něco hledá. Byl jsem připraveny že bdou problémy se zobrazením pro různá zařízení a prohlížeče. Já to ale nepotřebuji takto hluboce optimalizovat stačí aby to fungovalo v jednom rozlišení s Firefox nebo  Edge, ale na všech počítačích. Spouštím offline ze souboru index.html

Ahoj, 

rád bych požádal někoho zkušenějšího o radu. V zásadě jsem to již popsal v názvu přízpěvku a k tomu směřuje i múj dotaz, jestli je to vůbec možné, abych na jiněm stroji stejného modelu při nastavení stejného rozlišení měl odlišné rozložení tlačítek? Kdo by měl zájem mohu poskytnout ještě detailnější popis ale v zýsadě jde o to že jsem si vyladil zobrazení na svém laptopu na jedno rozlišení otestoval jsem to i na externím monitoru- vše vpořádku. 

Nahlásit jako SPAM
IP: 83.164.140.–
gna
~ Anonymní uživatel
1882 příspěvků
3. 9. 2024   #5
-
0
-

Jako čistě teoreticky, jestli to co jsi vytvořil, se může jinde nějak rozbít? Při stejném rozlišení by to mělo vypadat všude stejně.

Nahlásit jako SPAM
IP: 213.211.51.–
peter
~ Anonymní uživatel
4007 příspěvků
3. 9. 2024   #6
-
0
-

Cili, neco, co mam na webce, zmenit na kliknuti vzhled. To preci neni problem, to umi javascript.
Bud to budes generovat cele menu javascriptem nebo javascriptem zmenis class.

 Jestli do toho css das pozici nebo barvu je jedno. V pripade, ze delas selecty, jakoze kun muze byt cerny nebo bily, ale kocka i cervena, tak je lepsi to javascriptem generovat. Nebo jeste muzes pouzit jenom skryvani css-display:"block" / ""

https://jsfiddle.net/vdhgL8nq/
<div id=abc class=a>
  <input type=button value=1>
  <input type=button value=2>
  <input type=button value=3>
</div>
<input type=button value=nastavA onclick="nastav('a')">
<input type=button value=nastavB onclick="nastav('b')">

<style>
.a input:nth-child(1) {background-color:red;}
.a input:nth-child(2) {background-color:blue;}
.a input:nth-child(3) {background-color:green;}
.b input:nth-child(1) {background-color:cyan;}
.b input:nth-child(2) {background-color:violet;}
.b input:nth-child(3) {background-color:white;}
</style>

<script>
function nastav(value)
{document.getElementById('abc').className = value;}
</script>
Nahlásit jako SPAM
IP: 2001:718:2601:258:c4da:1475:538c:c723...–
Dave2K
~ Anonymní uživatel
10 příspěvků
3. 9. 2024   #7
-
0
-

#5 gna
OK. Taky si myslím, jak zde někdo poznamenal asi BUG.

Nahlásit jako SPAM
IP: 83.164.140.–
peter
~ Anonymní uživatel
4007 příspěvků
Nahlásit jako SPAM
IP: 2001:718:2601:258:c4da:1475:538c:c723...–
Dave2K
~ Anonymní uživatel
10 příspěvků
3. 9. 2024   #9
-
0
-

#6 peter

#6 peter
Ahoj, děkuji za ukázku nejsem si jistý zdali by se to dalo použít. Na ukázku přikládám část kódu CSS :::


body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    height: 100vh;
}
html, body {
    height: 100%;
    margin: 0;
}
#hmi-screen {
    background-position: center;
position: relative;
    background-size: cover;
    margin: auto;
overflow: auto;
background-color: #f0f0f0;
width: 100%; /* oder eine spezifische Breite */
    height: 100%; /* oder eine spezifische Höhe */
    max-width: 1360px;
    margin: auto; /* Zentriert den Container horizontal, wenn eine Breite festgelegt ist */
background-size: contain;
    background-repeat: no-repeat;
}
/* Stile für Bildschirme bis zu 1920px Breite */
@media (max-width: 1920px) {
    .button-type-1 
        /* Spezifische Stile hier */
{line-height: 0; vertical-align: middle; display: block;  margin: 0;border: none; padding: 0; position: absolute;left: 14.1vw;top:92.45vh; 
    background-position: center;background-repeat: no-repeat;background-size: contain;}
.button-type-2 
        /* Spezifische Stile hier */
{line-height: 0; vertical-align: middle; display: block;  margin: 0;border: none; padding: 0; position: absolute;left: 23.1vw;top:92.45vh; 
    background-position: center;background-repeat: no-repeat;background-size: contain;}
.button-type-3 
        /* Spezifische Stile hier */
{line-height: 0; vertical-align: middle; display: block;  margin: 0;border: none; padding: 0; position: absolute;left: 32.14vw;top:92.45vh; 
    background-position: center;background-repeat: no-repeat;background-size: contain;}
.button-type-4 
        /* Spezifische Stile hier */
{line-height: 0; vertical-align: middle; display: block;  margin: 0;border: none; padding: 0; position: absolute;left: 41.14vw;top:92.45vh; 
    background-position: center;background-repeat: no-repeat;background-size: contain;}
 

Nahlásit jako SPAM
IP: 83.164.140.–
Dave2K
~ Anonymní uživatel
10 příspěvků
3. 9. 2024   #10
-
0
-

#9 Dave2K
Mně jde opravdu jen o to zobrazení jinak už to mám naprogramované. Jde opravdu jen o to že při stejném rozlišení se na různých strojích zobrazuje jinak dokonce i na identickém kompu.

Nahlásit jako SPAM
IP: 83.164.140.–
peter
~ Anonymní uživatel
4007 příspěvků
3. 9. 2024   #11
-
0
-

Aha, no, problem je tedy kompatibilita prohlizecu. Zjisti si verze prohlizecu a typ.Ja bych sel do bootstrap,
oni si davaji prac s tim to odladit, ty pak nemusis.
 

To css mas teda napsane dost strasidelne. V tom se asi nechci pokouset zorientovat :)

.button-type-1, 
.button-type-2, 
.button-type-3, 
.button-type-4 
{
line-height: 0; vertical-align: middle; display: block;  margin: 0;border: none; padding: 0; position: absolute;
    background-position: center;background-repeat: no-repeat;background-size: contain;
}
.button-type-1 {left: 14.1vw; top:92.45vh;}
.button-type-2 {left: 23.1vw; top:92.45vh;}
.button-type-3 {left: 32.14vw; top:92.45vh;}
.button-type-4 {left: 41.14vw; top:92.45vh;}

toto je naprosto zbytecne, zkopiruj si to raci z bootstrap.css... 


body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    height: 100vh; /* tady das body-height=100vh */ 
}
html, body {
    height: 100%;  /* a v zapeti to prepisujes jinou hodnotou :) */ 
    margin: 0;
}
/* spis bych ty 2 definice prehodil, pak by to mohlo davat smysl */

Navic, css bez html kodu je opet tak nejak k nicemu.

Muzu poradit validator html, css, ktery by mohl odhalit nektere problemy. ale nevim, zda ti to problem vyresi.

https://validator.w3.org/#validate_by_input
https://jigsaw.w3.org/css-validator/#…

(html kod ziskas z prohlizece, FF - klik do stranky, ctrl+a oznacit vse, prave tlacitko, zobrazit zdrojovy kod vyberu, a tam pak ctrl+A oznacit vse, a zkopirujes to do policka pro primy vstup html a kliknes validovat)

Nahlásit jako SPAM
IP: 193.84.197.–
gna
~ Anonymní uživatel
1882 příspěvků
4. 9. 2024   #12
-
0
-

Koukám, že pozice zadáváš s vw/vh. To je relativně k velikosti "viewportu", která se v různých prohlížečích může lišit (a liší). Samo o sobě je to dobře, ale když pak nad to dáš třeba obrázek s pevnou velikostí, tak nebude sedět. (Nevím, jestli něco takového děláš a jak ten "screenshot" reprodukuješ)

Já jsem myslel, že je to teoretický problém u primitivního HTM, ale když máš reálný problém, kde vidíš rozdíl, tak prostě oprav to, co je špatně :)

Nahlásit jako SPAM
IP: 213.211.51.–
Dave2K
~ Anonymní uživatel
10 příspěvků
4. 9. 2024   #13
-
0
-

#11 peter
Ahoj, děkuji všem přizpěvatelům za podněty. Natočil jsem krátké video a uložil jsem jej na YT. Jde jen o klikací aplikaci která nic nedělá, jen simuluje chování prostředí Řídícího systému stroje. Vytvořil jsem to jako vlastní projekt v práci - není to moje standartní náplň. Nicméně na základě svých předchozích zkušeností jsem se do toho pustil s tím, že to podle zadaných požadavků to nebude problém. Tedy neni nutná optimalizace na vřechny prohlížeče a telefony stačí s jedním rozlišením na jeden prohlížeč. V závěru videa je ukázka jak se rozložení chová ve vývojovem prostředí Edge. Link here

https://youtube.com/watch?v=iJAUHD91INM

#

Nahlásit jako SPAM
IP: 83.164.140.–
gna
~ Anonymní uživatel
1882 příspěvků
5. 9. 2024   #14
-
0
-

Těch problému tam je jen pár a když sis s tím tak vyhrál, tak by asi stálo za to opravit to, ale to by bylo potřeba vidět celé.

A pokud teda nepotřebuješ responzivní design, tak nejjednodušší asi bude nastavit rozměry body natvrdo v pixelech a ta tlačítka místo vw/vh napozicuj taky v pixelech (nebo procentech). Takže se prostě nebude nic hýbat.

A to "@media (max-width: 1920px)" není nastavení, ale podmínka, že ten blok bude aktivní jen pokud to platí. Což teď asi nic nerozbije, ale asi to není to, co jsi měl v úmyslu, tak to můžeš vyhodit.

Nahlásit jako SPAM
IP: 213.211.51.–
peter
~ Anonymní uživatel
4007 příspěvků
5. 9. 2024   #15
-
0
-

Pekny :)
Nevim, proc se ti to rozsype. Vyber nejaky stav, kdy je to ok a kdy se to rozsype (pripis nazvy prohlizecu a verze, pripadne rozmery okna). Uloz to pres prohlizec jako html stranku a nekde to dej na web, at je mozne zkoumas html kod a css.

Jap pise gna, pokud te nezajima dynamicke rozmistovani prvku, pouzij pozicovani a dej to presne na pixely.
Ja si ted hraji s hrou pro staveni mostu. Hlavni okno nejak vycentruji a menicka a vrstvy v nem mam rozmistene pres position. Umi to zatim jen kreslit cary. Ale v jedne vrstve to kresli pri pohybu a do druhe to maluje. Nejspis se to nerozsype v novych prohlizecich, stare jsem nezkousel. Ale slo by to css upravit i pro ne. Jen jakoze priklad pouziti position.
https://mlich.zam.slu.cz/…/bb-edit.htm

Nahlásit jako SPAM
IP: 2001:718:2601:258:b103:d479:1e1c:e331...–
Dave2K
~ Anonymní uživatel
10 příspěvků
5. 9. 2024   #16
-
0
-

#15 peter
Ahoj, všem tady na fóru. Právě jsem zveřejnil aplikaci přes Netlify. https://sparkling-douhua-057157.netlify.app/

Kdybyste měl někdo chuť mi s tím pomoci rád bych se i něco naučil. Rozumný peníz bych byl ochoten zapaltit za řešení tohoto problému. Děkuji.

Nahlásit jako SPAM
IP: 83.164.140.–
gna
~ Anonymní uživatel
1882 příspěvků
5. 9. 2024   #17
-
0
-

Ta tlačítka vlož přímo do toho "hmi-screen", nebo ten "buttonContainer" spolu s "hmi-screen" uzavři do dalšího divu ať jsou přes sebe.

Šířku a výšku nastav natvrdo, nebo pokud to chceš mít responzivní, tak tam dej "aspect-ratio: 1366 / 768;" a nastav tlačítkům kromě pozice ještě rozměry a těm vnitřním obrázkům rozměry 100%.

Jde hlavně o to ať ta tlačítka umisťuješ na ten podkladový obrázek a nic jiného ti ty souřadnice nemrší, to je celé.

Nahlásit jako SPAM
IP: 213.211.51.–
peter
~ Anonymní uživatel
4007 příspěvků
5. 9. 2024   #18
-
0
-

tak, ve FF mam ted okno asi 100 px sirku a cele se to rozsypalo a prekryva :) To je cele asi dost blbe udelane. Ale to nevadi, to se vyresi.Podstatne je tam udelat spravne kontejnery, do kterych naplnis obsah.

- potrebujes nejaky hlavni div, ve kterem bude vsechno, ktery si nejak napolohojes na obrazovce
- pak tam vidim, ze to rozdelujes na 2 radky, dalsi div hlavicka, obsah
- pak tam mas ruzna tlacitka a navigace, vse soustredene v zahlavi.
- na tom videjku jsi mel jakesi plujici menu po prave strane. Tam je otazka, zda to muze prekryvat pole s obsahem nebo ne, jestli tam posetrit misto. Ale to lze resit pozdeji. V hlavicce bude hodne zalezet na tom, jak to mas udelane, aby se to nerozpadalo. Musi tam byt fakt vsechna ta tlacitka, neslo by nektere mene pouzivane menu skryt pod jedno tlacitko s rozbalenim? Vis, zase jako kopirovat vzhled uplne je dost nepraktcka zalezitost.

<div class="hlavni">
  <div class="hlavicka">
    <div class="nav1">...</div> - cokoliv chces polohovat a bude
 obsahovat skupinu prvku, tak musi byt uzavreno v divu
    <div class="nav2">...</div>
    <div class="nav3">...</div>
    <div class="nav4">...</div>
    <div class="text">...</div>
  </div>
  <div class="telo">
    <div class="content">
      ... tabulka ...
    </div>
  </div>
  <div class="paticka">
    <div class="nav5">...</div>
  </div>

</div>


pokud mas tu strukturu takhle nejak, ted na to koukat nejdu, tak neni problem nastavit

.hlavni {width... } /* tady musis mit width */
.hlavicka {position:relative; width:100%; height...}
.content {position:relative; width:100%; height...}
.paticka {position:relative; width:100%; height...}

/* a pak neni problem pres position absolute tam napozicovat jednotliva menicka */
/* sice se uplne nezbavis prekryvani, ale budes mit nad tim lepsi kontrolu */
.nav1 {position:absolute; width:300px; height...; top:0; left:0;}
.nav2 {position:absolute; width:300px; height...; top:0; right:0;}
.nav3 {position:absolute; width:300px; height...; top:0; left:300px;}
...

Takhle to dopadlo na tomhle notebooku, FF 130.0, https://ctrlv.cz/ttRk

Nahlásit jako SPAM
IP: 193.84.197.–
peter
~ Anonymní uživatel
4007 příspěvků
5. 9. 2024   #19
-
0
-

Super, no, koukam na js a mas to cele generovane pres obrazky. Potes. Aspon jsi mohl pouzit svg nebo najit free-font, ktery je tomu podobny. Nebo jsi mohl pouzit jeden obrazek s abecedou a z nej pismenka vystrihovat.Nebo se na to vykasli a pouzij Arial, to je hodne dobry font.
 

Nahlásit jako SPAM
IP: 193.84.197.–
Dave2K
~ Anonymní uživatel
10 příspěvků
12. 9. 2024   #20
-
0
-

Ahoj kolegové,

děkuji všem za příspěvky a pomoc. Bylo mi potěšení s vámi spolupracovat. Určitě jsem si od každého něco vzal. Nakonec po nikam nevedouci snaze o upraveni stavajiciho programu jsem vytvořil program nový. Není to komplet ještě hotové. Nyní abych se vyhnul dalším problémům o kterých nemám možná ani tušení jsem se rozhodnul, poslední verzi opět zveřejnit a požádat vás o menší supervizi. :) https://66e2b11f87b0752fce5fb708--fantastic-crumble-467df5.netlify.app/

Nahlásit jako SPAM
IP: 83.164.140.–
gna
~ Anonymní uživatel
1882 příspěvků
12. 9. 2024   #21
-
0
-

Líbí se mi, že jsi zjednodušil to CSS.

Nelíbí se mi, že tam máš 400+ funkcí, které dělají to samé :) Ta obsluha kliknutí by mohla být jedna společná funkce, která by cílový screen třeba vytáhla z atributu kliknutého elementu.

Ale zdá se, že to funguje, tak asi v pohodě.

Nahlásit jako SPAM
IP: 213.211.51.–
remmidemmi0
Věrný člen
14. 9. 2024   #22
-
0
-

#1 Dave2K
"jestli je to vůbec možné, abych na jiněm stroji stejného modelu při nastavení stejného rozlišení měl odlišné rozložení tlačítek?"

V podstatě to je možné. Nebudu ti psát kódy, ty si napiš sám. Napíšu ti princip. V angličtině se tomu říká "customized setting". V prvé řadě tvůj program musí otestovat stroj. Testem zjistí rozlišení, dále zjistí typ stroje, třeba také operační systém, CPU a další info. Záleží na tom, zda se jedná o počítač na netu nebo nějaký samostatně fungující počítač, například počítač, který je řídí nějakou mašinu a ty potřebuješ podle vybavení té mašiny jen uspořádat tlačítka na obrazovce. 

Z toho, co tvůj počítač zjistí testem pak uděláš nastavení tlačítek. Příklad na stránce remmidemmi.co.uk takto testuju počítač návštěvníka a podle toho co zjistím, pak běží program. Nejsou tam žádný pitomý kukíky. Je to založený na php testech. Vyber si tam záložku Info a pak "test your computer". Takto lze testovat také odkud kdo přijde a eliminovat třeba návštěvy z Ruska.

U systému který není na netu, třeba mikropočítačový systém, to samé podobné. Do této bedny

http://www.jplabs.co.uk/projects/bh1017a.html

se zezadu strkají desky, šuplíky s elektronikou. Hlavní mikropočítač pod LCD testuje jaké tam má šuplíky s elektronikou a podle toho si natahne program a ten spustí. Není to teda vůbec na internetu. Je to nějaký řídící mikropočítačový systém.

Nahlásit jako SPAM
IP: 37.48.10.–
remmidemmi0
Věrný člen
14. 9. 2024   #23
-
0
-

#4 Dave2K
"Zkusím to popsat trochu jinak. Nachvíli úplně zapomeńte na klasické webovky. Je pouzit HTML, JS a CSS. Účel tohoto byl přiblížit grafické rozhraní stroje. Na obrazovce stroje vidíme nějaké grafické rozložení, jde o dotykový display takže kliknete na urcitý symmbol který představuje nějakou funkci pomocí které se dostanete na jiné rozhraní, grafické rozložení se změní a vy můžete v reálu něco nastavit a jít zase zpět do hlavní nabídky nebo do dalšího submenu atd. je to docela rozvětvené. "

No jasně akorát furt není jasný, jestli to je na internetu nebo stand-alone computer s dotykovou LCD třeba v čekárně na úřadu práce :) kde podle použitého počítače se zobrazují tlačítka pro směrování osob někam...

Prostě na počátku musíš otestovat ten hardware a operační systém, pokud tam nějaký je. Třeba u mikropočítačového systému s dotykovou LCD nemusí být žádný OS. Naopak, když máš třeba wokna nebo liux a dokážeš nainstalovat PHP, máš pak mraky možností.

Nahlásit jako SPAM
IP: 37.48.10.–
peter
~ Anonymní uživatel
4007 příspěvků
15. 9. 2024   #24
-
0
-

Blbe je, ze to jsou ted image. Ja treba bezne kopiruji ze stranek texty a tady nic oznacit nejde, pac mi chce pouzit funkci pro drag-drop obrazku a ten presunout jinam :)Jinak pekny, vypada to ted vic prehledneji.

Jeste jsem videl nekde pouzivat takovou fintu, ale nesmis tam mit jquery...

$ = document.querySelector;
$$ = document.querySelectorAll;

//document.getElementById('button-E12').addEventListener('click', function() {
//  changeScreen('AJC');
//});

$('#button-E12').addEventListener('click', function() {
  changeScreen('AJC');
});

A jinak by slo asi priradit vsem tlacitkum podle class funkci stisknuti a uvnitr se podle if-case-pole rozhodnes, co se stane

//$('#button-E12').addEventListener('click', function() {
//  changeScreen('AJC');
//});

$(.butt).addEventListener('click', function() {
  buttClick(this);
});

function buttClick(el)
{
id= this.id.split('-')[1] // button id="button-ZC1" -> ZC1
case id of
  {
  'zc1' :  changeScreen('AJC'); break
  }
}


// nebo to zapsat primo do toho butonu, do class, value nebo tak
//  <button id="button-ZC1-AJC" class="btn btn-A1"></button>
id= this.id.split('-')[2] // button id="button-ZC1" -> 1: ZC1 2: AJC
changeScreen(id); 
Nahlásit jako SPAM
IP: 193.84.197.–
Dave2K
~ Anonymní uživatel
10 příspěvků
18. 9. 2024   #25
-
0
-

#22 remmidemmi  

Ahoj, vlastně jde jen o to, že celý soubor je uložený někde na firemním serveru. Přístup k němu bude puze přes firemní ethernet. V tom původním kódu programu byl problém hlavně problém v html. Bylo to napsané hodně nestandartně :D. Díky za odkaz, možná to ještě budu potřebovat. 

Nahlásit jako SPAM
IP: 83.164.140.–
Dave2K
~ Anonymní uživatel
10 příspěvků
18. 9. 2024   #26
-
0
-

#24 peter

Ahoj,

děkuji za tipy, vyzkouším. Problém je že, už toho mám hodně napsaného ještě postaru :D.

Nahlásit jako SPAM
IP: 83.164.140.–
peter
~ Anonymní uživatel
4007 příspěvků
19. 9. 2024   #27
-
0
-

Mno, jenom jsem prepsal myslenku, co zminil gna. jako atribut jsem pouzil zrovna id, protoze ho nejspis pouzivas i pro dalsi css. Ale, jinak se pouziva spis dataSet.
 

https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

<article
  id="electric-cars"
  data-columns="3"
  data-index-number="12314"
  data-parent="cars">
  …
</article>

const article = document.querySelector("#electric-cars");
// The following would also work:
// const article = document.getElementById("electric-cars")

article.dataset.columns; // "3"
article.dataset.indexNumber; // "12314"
article.dataset.parent; // "cars"



// jakoze pro tvuj pripad by to bylo neco takoveho...

//    <button id="button-ZC1-AJC" class="btn btn-A1" data-scr="ZC1"></button>

document.querySelector(.butt).addEventListener('click', function() {
  changeScreen(this.data.scr);
});

Cili, do html kodu bys primo napsal, jaka scr se ma spustit a v js by na to byl jen ten jeden radek. A pokud bys potreboval odlisovat funkci, tak bych pouzival jen jiny atribut v data, misto src treba neco jineho. Pak bys mel teda 2 funkce i v js.
Ted to mas tak, ze kdys pridas tlacitko, musis pripsat i js a css kod, jinak nic nefunguje.
Ale, je videt, ze ses inspiroval tim BootsTrap. Taky to tak delam, ze si vykopiruji jen ty class, ktere pouzivam, kdyz se mi chce setrit misto :)

Nahlásit jako SPAM
IP: 193.84.197.–
Zjistit počet nových příspěvků

Přidej příspěvek

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 5 hostů

Podobná vlákna

Rozložení čísla — založil Sk1X1

Rozlozeni mp3 — založil cibule

Špatné rozložení emailu — založil Kostka kulatá

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032024 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý