Stejná výška jako u jiného elementu

Anonymouz:
Cez .style zisťuješ nastavené vlastnosti elementu (CSS, alebo inline) - v tomto prípade výšku. Ak chceš zistiť reálnu výšku tak na to slúži .offsetHeight.

Ale to o čo sa snažíš sa dá pohodlne vyriešiť bez JS a to použítím obalu ktorému nastavíš display: table A potomkom nastavíš display: table-cell. Tak budú mať automaticky rovnakú výšku.

Anonymouz:
Důležitá je otázka proč? Nestačí jen, aby to vypadalo že jsou stejně dlouhé?

Anonymouz:
Ak #levy,#pravy dáš box-sizing: border-box; Tak potom v js nemusíš čarovať s paddingom, ale môžes priamo nastaviť výšku ľavého podľa pravého. Ukážka

Anonymouz:
Živá ukázka

Taky je lepší použít getBoundingClientRect() protože nezaokrouhluje výšky. Taky jsem přidal listener na změnu velikosti okna, aby se to případně přepočítalo. Kvůli tomu jsem vyhodil podmínku, že je levý menší protože když se okno zmenší a pak zvětší, tak se levý natáhne ale už nevrátí. Případně si ji vrať.

Problém s onresize je ten, že aby fungoval všech prohlížečích, tak jde použít jen na objektu window. Ovšem změna velikosti elementu může nastat nejenom změnou velikosti okna prohlížeče (například zoomem). Takže je ještě potřeba pohlídat všechny jiné možnosti, kdy se může velikost elementu změnit. Ale nejlepší řešení bude nějaký polyfill nebo knihovna které umožní hlídat měnu velikosti přímo toho elementu.

Jak funguje ten polyfil nebo knihovna? To jsou ty věci co se musí instalovat přes příkazovou řádku v node.js? Btw šlo by čistě teoreticky udělat toto stejné řešení i pomocí php?

Dorien:
„Jak funguje ten polyfil nebo knihovna?“
Rozšíří stávající podporu (pro prohlížeče které něco nepodporují mají v sobě kód, který zajistí, že to fungovat bude) nebo přidávají nové funkce které můžeš použít.

„To jsou ty věci co se musí instalovat přes příkazovou řádku v node.js?“
Záleží na autorovi řešení, co si zvolí. Když jsem zběžně prolétl nějaké projekty, tak jsem viděl instalaci pomocí npm, boweru ale i předkompilované soubory které se ručně zkopírují. Vypadá to ale, že npm je standard k tomu některé projekty obsahují i jiné možnosti. Jinak to že se to instaluje pomocí npm by nemělo být překážkou.

„Btw šlo by čistě teoreticky udělat toto stejné řešení i pomocí php?“
Ne. PHP běží na serveru, javascript v prohlížeči. A ty ten problém máš v prohlížeči. Teoreticky by jsi mohl použít nějaký jiný programovací jazyk, který běží v prohlížeči. Bohužel, kromě javascript neexistuje žádný jiný, který by fungoval ve všech běžně používaných prohlížečích. Takže tvou jedinou šancí je javascript.

Já mám právě raději řešení na serveru, než v prohlížeči, které si mohou lidé vypnout. PHP script tedy nedovede, vytáhnout údaj např. z CSS do proměnné, kterou by pak vložil jako hodnotu height?

Mám následující problém. Když se pustím do nějakých online kurzů pro začátečníky atd, tak během chvíle se naučím jak fungují proměnné, if, else, různé operace, napsání něčeho do dokumentu atd. Problém je, že v praxi tyto věci nedovedu použít k něčemu užitečnému a naopak užitečné věci, které bych potřeboval, nedokážu provést se znalostmi, které z těch kurzů a knih jsou. Připadá, mi jako kdyby mi chyběl nějaký mezičlánek. Naprosto stejný problém mám jak u JS tak u PHP.

Dorien:
„PHP script tedy nedovede, vytáhnout údaj např. z CSS do proměnné, kterou by pak vložil jako hodnotu height?“
Ano, nedokáže.

„Já mám právě raději řešení na serveru, než v prohlížeči, které si mohou lidé vypnout.“
Ano, já taky. Kde to jde tak preferují také serverové řešení. Ovšem toto není ten případ.