K personalizaci obsahu a reklam, poskytování funkcí sociálních médií a analýze naší návštěvnosti využíváme soubory cookie. Informace o tom, jak náš web používáte, sdílíme se svými partnery pro sociální média, inzerci a analýzy. Partneři tyto údaje mohou zkombinovat s dalšími informacemi, které jste jim poskytli nebo které získali v důsledku toho, že používáte jejich služby.
Používáme nezbytné cookies pro fungování webu a s tvým souhlasem také analytické a marketingové cookies.
Zajišťují základní funkce, bezpečnost a služby, které sis vyžádal. Nelze je vypnout.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| ITnetwork | ITnetwork | Provoz webu, relace, přihlášení a uložení nastavení cookies. | PHPSESSID, auth_token, sid, itn_consent_impression, __Host-itn_consent | Relace až 1 rok |
| Google Tag Manager | Správa značek a načítání měřicích nástrojů webu. | Žádné | Neukládá se | |
| Google Fonts | Načítání typografie webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google Hosted Libraries | Načítání potřebných knihoven a stylů webu. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele | |
| Google reCAPTCHA | Ochrana formulářů a webu před zneužitím. | _GRECAPTCHA, rc::a, rc::b, rc::c, rc::f | Relace až 180 dní | |
| YouTube | Přehrávání vloženého video obsahu. | localStorage, IndexedDB; cookies after playback interaction | Relace až trvalé úložiště | |
| Vimeo | Vimeo | Přehrávání vloženého video obsahu. | __cf_bm, _cfuvid, vuid, localStorage, IndexedDB | Relace až 2 roky |
| Facebook Login | Meta | Přihlášení pomocí účtu třetí strany. | Úložiště řízené poskytovatelem | Relace až 1 rok |
| GoPay | GoPay | Zpracování uživatelem vyžádané platby. | Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
Pomáhají nám porozumět používání webu a zlepšovat ho.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Analytics 4 | Měření návštěvnosti a používání webu. | _ga, _ga_* | Až 2 roky | |
| Microsoft Clarity | Microsoft | Měření návštěvnosti a používání webu. | _clck, _clsk, _cltk | Relace až 1 rok |
Slouží k měření kampaní, personalizaci reklamy a marketingové komunikaci.
| Služba | Poskytovatel | Účel | Cookies a úložiště | Doba uložení |
|---|---|---|---|---|
| Google Ads | Měření kampaní, reklama a remarketing. | _gcl_au, _gcl_ls | Relace až 90 dní | |
| Meta Pixel | Meta | Měření kampaní, reklama a remarketing. | _fbp, _fbc, localStorage | Až 90 dní |
| Sklik | Seznam.cz | Měření kampaní, reklama a remarketing. | retargeting, sid, szn:* | Relace až trvalé úložiště |
| LinkedIn Insight | Měření kampaní, reklama a remarketing. | bcookie, li_gc, lidc, __cf_bm | Relace až 1 rok | |
| Ecomail | Ecomail.cz | Měření kampaní, reklama a remarketing. | ecmid, Úložiště řízené poskytovatelem | Dle podmínek poskytovatele |
| Atribuce kampaní ITnetwork | ITnetwork | Přiřazení návštěvy a objednávky ke kampani. | campaign_clid[*], user_session_context | Až 1 rok |
V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.
Druhá možnost je, že bych vyřešil text v obrázku přes pozicování, jenže mě štve, že když zvětším nebo zmenším stránku, tak text nezůstane v obrázku, ale na svým souřadnicích.
Tak, zarovnáno na střed, text napozicován.
Pokud stránku zvětšuji, tak se mohu posouvat pouze doprava, ale doleva nemohu, proč?
<div style="display:flex; justify-content:center; align-items:center;">
<div class="pismena_v_klavesnici">
<img src="klavesnice.png" usemap="#klavesnice">
<div id="Q">
<h3>Q</h3>
</div>
<div id="W">
<h3>W</h3>
</div>
<div id="E">
<h3>E</h3>
</div>
<div id="R">
<h3>R</h3>
</div>
<div id="T">
<h3>T</h3>
</div>
<div id="Z">
<h3>Z</h3>
</div>
<div id="U">
<h3>U</h3>
</div>
<div id="I">
<h3>I</h3>
</div>
<div id="O">
<h3>O</h3>
</div>
<div id="P">
<h3>P</h3>
</div>
</div>
</div>
A co je cílem? pokud jen :hover nějakého znaku, tak bych opravdu využil jen CSS a klávesnici bych si normálně nastyloval bez obrázků.
Aktivní okno bych řešil později, teď se mi naskytl problém, viz příspěvek výše.
Cílem by ale bylo, aby se písmenko (tedy celý čtvereček) obarvil až po kliknutí na něj, nikoli po přejetí.
To čistým CSSkom nedosiahneš. Musel by si to robiť cez checkboxy, to skôr urob cez JS.
Dobře, co ten problém se zvětšením okna?
Jednoducho, nerob klávesnicu ako obrázok, poskladaj ju z html elementov a naštýluj csskom. Tým pádom ti klávesy budú sedieť s popiskami kláves.
Zajímavé a krásné řešení, ale to opravdu nejde jinak?
Mně se to začalo dělat až poté, co jsem zarovnal klávesnici i s vnořeným textem na střed.
No musel by si scalovať text, súčasne s klávesnicou. Aspoň ak dobre chápem problému.
Tak tedy: http://ejines.tk/
Můžete si všimnout, že když stránku zvětšujete, omezuje se možnost posunutí doleva.
Jde to pomocí obrázku a js soure map. Podívej se na to a když budeš hledat, tak najdeš i responzivní řešení.
Omluv mě, pokud mi něco někdy hned nedojde, ale teprve začínám.
Dal jsem obrázku ID a v CSS jsem nastavil tyto hodnoty:
max-width: 100%;
height: auto;Na mobilu, když přiblížím obrázek, posouvání funguje, ale na desktop stále ne.
Asi moc nerozumím, tomu co chceš ale když začínáš proč sis zvolil něco tak složitého.
Tak snad to nedělá jenom mně.
Když stránku přiblížíš tak o 250% a více, nejde posouvat doleva, ale jenom doprava.
Přiložím ti přílohu.
Protože stránka se z výchozí polohy dá scrollovat pouze doprava
Zobrazeno 17 zpráv z 17.