NOVINKA - Online rekvalifikační kurz Java programátor. Oblíbená a studenty ověřená rekvalifikace - nyní i online.
NOVINKA – Víkendový online kurz Software tester, který tě posune dál. Zjisti, jak na to!

Diskuze: Web běží, ale problém je u IE10 a starší

V předchozím kvízu, Online test znalostí HTML a CSS, jsme si ověřili nabyté zkušenosti z kurzu.

Aktivity
Avatar
Michal Kuba
Tvůrce
Avatar
Michal Kuba:17.1.2016 22:47

Ahoj
Došla mi zpětná vazba od klienta, že některým uživatelům se stránka nezobrazuej dobře, používají IE. Já mám na PC IE11 a v něm to jde, jakmile ale web zapnu ve starší verzi, je zle. Prakticky nic z CSS nefunguje, většina pozic, výšek, šířek, paddingů, marginů, fontů atp.

Dá se to nějak fixnout snadno, například nějakým speciálním html tagem do hlavičky pro IE, aby to bralo styly jak má nebo třeba nějakým generátorem, který moje CSS sebou prožene a vytvoří CSS pro Explorer? Opravdu se mi nechce pouštět do 3000 znaků stylů a postupně vše nějak opravovat bez vidiny úspěšného konce.

 
Odpovědět
17.1.2016 22:47
Avatar
alfonz
Člen
Avatar
alfonz:17.1.2016 22:51

https://css-tricks.com/…-stylesheet/

Nahoru Odpovědět
17.1.2016 22:51
lmao
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Michal Kuba
Neaktivní uživatel:17.1.2016 22:57

Microsoft ukončil podporu pro IE menší než 11. Takže pokud to už neřeší Microsoft, tak nevidím důvod to řešit také :)

Nahoru Odpovědět
17.1.2016 22:57
Neaktivní uživatelský účet
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Neaktivní uživatel
Michal Kuba:17.1.2016 23:00

No jde o to, že ti lidi používají na net nějaký starší IE a chtějí po nás (po mně), aby jim to fungovalo i na jejich prohlížečích. Takže se s tím musím nějak popasovat.

 
Nahoru Odpovědět
17.1.2016 23:00
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na alfonz
Michal Kuba:17.1.2016 23:01

Přijde mi to, že jen ukazují jak pro některé verze jak co stylovat, ne? Nebo když to nějak aplikuji v html hlavičce, pomůže to tomu webu?

 
Nahoru Odpovědět
17.1.2016 23:01
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Michal Kuba
Neaktivní uživatel:17.1.2016 23:17

To ti ukazuje, jak načíst styl pro IE5,6,7,8,... jen v IE5,6,7,8,... prohlížeči. Samozřejmě styly si musíš napsat sám.

Nahoru Odpovědět
17.1.2016 23:17
Neaktivní uživatelský účet
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Neaktivní uživatel
Tonda Kozák:17.1.2016 23:56

Neaktivní uživatel
Na blbost měsíce to ještě není, ale jsi blízko.

Michal Kuba
To je celkem záhada, protože mezi 10 a 11 by neměl být takový rozdíl.
Dej sem odkaz na ty své problémové stránky a zjistíme, kde se stala chyba.

 
Nahoru Odpovědět
17.1.2016 23:56
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Neaktivní uživatel:18.1.2016 0:06

Kdepak je tu blbost?
http://www.infoworld.com/…-and-10.html
https://www.microsoft.com/…f-IE-support

Editováno 18.1.2016 0:07
Nahoru Odpovědět
18.1.2016 0:06
Neaktivní uživatelský účet
Avatar
Tomáš Maňhal
Člen
Avatar
Odpovídá na Neaktivní uživatel
Tomáš Maňhal:18.1.2016 1:49

Pořád to nechápeš...To, že Microsoft ukončil podporu neznamená, že ho lidi přestanou používat.

 
Nahoru Odpovědět
18.1.2016 1:49
Avatar
Tomáš Maňhal
Člen
Avatar
Odpovídá na Michal Kuba
Tomáš Maňhal:18.1.2016 1:52

Předpokládám, že bude problém s tím, že používáš HTML5. Doplň Shiv a uvidíme. Každopádně bez odkazu nevíme nic a nedokážeme pomoct.

https://github.com/…as/html5shiv

Pro JS taky Modernizr třeba. Nástrojů je spousta.

Editováno 18.1.2016 1:54
 
Nahoru Odpovědět
18.1.2016 1:52
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Tomáš Maňhal
Neaktivní uživatel:18.1.2016 9:21

Tak máme každý jiný názory ;) Já zase myslím, že je to pitomost těch lidi, že použivaji to co už není podporované, ikdyž jim všude svítí aby si stáhli novou verzi protože stávájící už není podporovaná.

Editováno 18.1.2016 9:23
Nahoru Odpovědět
18.1.2016 9:21
Neaktivní uživatelský účet
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Neaktivní uživatel
Tonda Kozák:18.1.2016 9:26

V tom, že desítka (třeba na Vistách) pořád podporovaná je. Ale je spíš celkově ve tvém přístupu.
Michal se totiž na starší IE moc dobře vybodnout nemůže, když sám klient si na to stěžuje - teda pokud nechce s webařinou seknout.

 
Nahoru Odpovědět
18.1.2016 9:26
Avatar
Michal Štěpánek
Člen
Avatar
Odpovídá na Neaktivní uživatel
Michal Štěpánek:18.1.2016 9:30

Pokud lidi používají WXP a chtějí IE, tak si asi těžko stáhnou něco novějšího, že? A navíc, když dělám web, tak si nemůžu diktovat, na čem to bude vidět a na čem ne, bo by se mi na něj pak lidi vyprdli,..

Editováno 18.1.2016 9:32
Nahoru Odpovědět
18.1.2016 9:30
Nikdy neříkej nahlas, že to nejde. Vždycky se totiž najde blbec, který to neví a udělá to...
Avatar
Neaktivní uživatel
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Neaktivní uživatel:18.1.2016 9:33

Nenutím ho tu přece poslat zákazníka do háje. Mně např. stačilo vysvětlit, že podpora je ukončená a aby si stáhli novější prohlížeč. A bylo vyřešeno.

Michal Štěpánek Já zase myslím, že je to pitomost těch lidi, že použivaji to co už není podporované, ikdyž jim všude svítí aby si stáhli novou verzi protože stávájící už není podporovaná.

Editováno 18.1.2016 9:34
Nahoru Odpovědět
18.1.2016 9:33
Neaktivní uživatelský účet
Avatar
Michal Štěpánek
Člen
Avatar
Odpovídá na Neaktivní uživatel
Michal Štěpánek:18.1.2016 10:04

Starší lidi těžko přesvědčíš, aby si koupili nový PC, když ho potřebují jen na "sem tam kouknout na internet" a prohlídnout fotky a ten starý ještě funguje...
Prostě musíš udělat web tak, aby ho bylo možno zobrazit na čemkoliv.

Editováno 18.1.2016 10:05
Nahoru Odpovědět
18.1.2016 10:04
Nikdy neříkej nahlas, že to nejde. Vždycky se totiž najde blbec, který to neví a udělá to...
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 10:14

Web běží zde: www.hcb-karvina.cz
Jak jsem říkal, doufám ze to půjde ošetřit nějak min bolestně, než dopisovat styly pro starší ie do CSS souboru o více než 3000 řádcích. To by mě asi kleplo

 
Nahoru Odpovědět
18.1.2016 10:14
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Michal Kuba
Tonda Kozák:18.1.2016 10:34

Začal bych tím, že bych přidal doctype (ty to tam jakoby máš, ale protože není na začátku dokumentu, tak ho prohlížeč ignoruje).
Pokud se to nespraví, tak napiš, jaké jsou konkrétní rozdíly mezi verzemi.
Pokud si totiž emuluju IE do starších verzí, tak 10 je stejná jako 11, v devítce není vidět menu... ale žádné problémy s marginem tu nevidím.

 
Nahoru Odpovědět
18.1.2016 10:34
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 11:52

Vidíš, doctype mi utekl, ale stále to neřeší vše. Už se to posunulo na střed, jak to má být, jenže se mi to na desktopu zobrazuje částečně jako mobilní verze a navíc prakticky bez stylů. Viz screen vrchní části, níže na stránce je to prostě špatně poskládané, divy nemají zakulacení ani žádné pozice atp.

 
Nahoru Odpovědět
18.1.2016 11:52
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 11:53

Jinak já prostě v IE11 v "nastavení kompatibilního zobrazení" přidám právě tento web a přepne se mi to do špatného zobrazení, které je patrně u starších prohlížečů :/

 
Nahoru Odpovědět
18.1.2016 11:53
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 14:19

Upravil jsem ještě něco v hlavičce, ale pořád to nefunguje. Nebudu muset dopisovat téměř 3000 řádků tak, aby to bral IE, že ne?

 
Nahoru Odpovědět
18.1.2016 14:19
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Michal Kuba
Tonda Kozák:18.1.2016 14:21

Tak to děláš špatně. Nastavení kompatibilního zobrazení je něco jiného, než to co se zobrazuje v IE 10, 9, 8, 7. Je to tuším že děláno v režimu IE 6 (který teď ale nikdo nepoužívá).

Pokud chceš testovat, jak to vypadá ve starších verzích, zmáčkni F12, otevřou se vývojářské nástroje a na kartě Emulace si to můžeš přepínat.

Já problémy vidím 2.
V IE 9 se ti nezobrazuje pozadí navigace.
A v IE 8 to má mobilní styly. Používáš mobile-first, že? IE 8 media queries neumí. - Řešení: nepoužívat mobile-first nebo to přelepit JavaScriptem: http://jecas.cz/media#…

 
Nahoru Odpovědět
18.1.2016 14:21
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Michal Kuba
Tonda Kozák:18.1.2016 14:31

Aby se to menu nezobrazovalo v IE9 a níž bíle, musíš nastavit nějaký fallback (oni neumí ty css gradienty), takže třeba jednoduše obyčejnou barvu nebo použít vlastnost filter nebo obrázek. Vyber si.

(Jinak moc netuším, jak se prohlížeče chovají, když jim dáš <!DOCTYPE>, spíš se používá <!DOCTYPE html>).

 
Nahoru Odpovědět
18.1.2016 14:31
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 14:44

No, a právě ty emulace mi nefungují, proto jsem dával ten kompatibilní režim :D

 
Nahoru Odpovědět
18.1.2016 14:44
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Michal Kuba
Tonda Kozák:18.1.2016 14:48

Co znamená, že nefungují?

 
Nahoru Odpovědět
18.1.2016 14:48
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 14:51

Sotva jsem to začal psát, tak se začal explorer aspoň trošku chovat a už to funguje :) :D

 
Nahoru Odpovědět
18.1.2016 14:51
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 15:00

Zkusil jsem to pustit třeba v IE7 a nenačte se mi to ani, kvůli této chybě v jquery.js:
Objekt neumožňuje použití vlastnosti či metody addEventListener.

Ta funkce končí na řádku 3457 a řekl bych, že já s tím nic nezmůžu, ne? Jde o funkci "jQuery.ready­.promise = function( obj )"

 
Nahoru Odpovědět
18.1.2016 15:00
Avatar
Tomáš Maňhal
Člen
Avatar
Odpovídá na Michal Kuba
Tomáš Maňhal:18.1.2016 15:16

Zase nezacházej do extrému...na IE7 se vyprdni a to z vysoka. Když už, tak to vem od IE8 a vejš.

 
Nahoru Odpovědět
18.1.2016 15:16
Avatar
Tonda Kozák
Člen
Avatar
Tonda Kozák:18.1.2016 15:18

Děláš něco špatně. V konzoli se mi sice ty chyby objeví, ale web se načte.

 
Nahoru Odpovědět
18.1.2016 15:18
Avatar
Tonda Kozák
Člen
Avatar
Tonda Kozák:18.1.2016 15:19

.

 
Nahoru Odpovědět
18.1.2016 15:19
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:18.1.2016 17:46

Jo, to je přesně to špatné zobrazení.. Nedělají tam možná bordel nějaké JS, které by stačilo pro IE omezit? Takhle ta stránka prostě nemůže vypadat :/

 
Nahoru Odpovědět
18.1.2016 17:46
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Michal Kuba
Tonda Kozák:18.1.2016 18:09

Chlape, vždyť jsem ti to psal už ve 14:21. O deset minut později jsem ti popsal i řešení druhého problému.

 
Nahoru Odpovědět
18.1.2016 18:09
Avatar
TomasGlawaty
Člen
Avatar
Odpovídá na Michal Kuba
TomasGlawaty:18.1.2016 18:14

používáš jQuery, která nepodporuje IE <=8
tyto IEčka nepodporují DOM metodu "addEventListener ", ale podporují vlastní alternativní metodu "attachEvent".
Řešení je buď použít starší jQuery podporující starší IE (nejsem si jistý, ale nějaké starší verze by měly podporovat), nebo podporovat IE9+.
Osobně bych volil druhou variantu ...

 
Nahoru Odpovědět
18.1.2016 18:14
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Tonda Kozák
Michal Kuba:20.1.2016 23:26

Zkusil jsem ten daný soubor respond.min.js odkázat v hlavičce hned za posledním CSS souborem, jenže to vůbec nepomohlo :/

 
Nahoru Odpovědět
20.1.2016 23:26
Avatar
Tonda Kozák
Člen
Avatar
Odpovídá na Michal Kuba
Tonda Kozák:21.1.2016 20:18

Tak to bude asi tímto:

Respond.js works by requesting a pristine copy of your CSS via AJAX, so if you host your stylesheets on a CDN (or a subdomain), you'll need to set up a local proxy to request the CSS for old IE browsers. Prior versions recommended a deprecated x-domain approach, but a local proxy is preferable (for performance and security reasons) to attempting to work around the cross-domain limitations.

https://github.com/…jehl/Respond#…

 
Nahoru Odpovědět
21.1.2016 20:18
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 34 zpráv z 34.