Avatar
Vakos
Redaktor
Avatar
Vakos:

Ahoj,
v současné době kóduji jeden web a narazi jsem na jednu věc a chtěl bych se zeptat, jakým kódem by jste to řešili vy

Odpovědět 13.8.2014 14:34
"Jediný způsob, jak dělat skvělou práci, je milovat to, co děláte. Pokud jste to ještě nenašli, hledejte dál. Ne...
Avatar
Odpovídá na Vakos
Michal Žůrek (misaz):

tak základem bych viděl lichoběžník (http://www.itnetwork.cz/…vary-v-css-3), pak si v JavaScriptu pohraješ s čísly.

Nahoru Odpovědět 13.8.2014 16:23
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

S lichoběžníky by to šlo, ale zde máš zakulacené hrany... Na tuto situaci bych použil pravděpodobně přesně naměřený obrázek - každé okýnko zvlášť...

Tzn. budeš mít každé LI nastylované na jinou šířku a s jiným pozadím.

Stín pak aplikuješ pravděpodobně na celé UL - zvlášť.

Editováno 13.8.2014 16:35
Nahoru Odpovědět  +1 13.8.2014 16:34
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Odpovídá na Honza Bittner
Michal Žůrek (misaz):

napadají mě CSS 3d transofarmace, ale to by bylo složité a ještě zkoumám, kdybychom ten okraj vyřízli. Že by to byl normální hranantý div a spomocí css clip-path bychom vyřízki půlkruh nahoře a dole.

Nahoru Odpovědět 13.8.2014 16:48
Nesnáším {}, proto se jim vyhýbám.
Avatar
Michal Žůrek (misaz):

primitivní verzi mám hotovou :)

http://jsfiddle.net/tvaxy1bj/

Nahoru Odpovědět 13.8.2014 17:57
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

Jasně, jasně... avšak tady je zase problém s průhledností okolí (zelená část tvého návrhu).

Navíc udělat to menu tak, aby fungovalo aj v IE8+ půjde podle mne jen pomocí těch obrázků pro každé li... :/

Holt není vždy nejlepší dělat design abnormálně.

Nahoru Odpovědět  +1 13.8.2014 18:13
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Vakos
Jiří Gracík:

Souhlasím s Honzou, obrázky budou asi nejlepší :)

Nahoru Odpovědět 13.8.2014 18:17
Creating websites is awesome till you see the result in another browser ...
Avatar
Samuel Illo
Redaktor
Avatar
Odpovídá na Vakos
Samuel Illo :

To zahnutie menu teda neviem urobiť, jedine pomocou tých obrázkov ako píše Honza Bittner, inak by som vedel len zahnutý tieň na plochom menu.
A môj názor je, že to menu by bolo krajšie ploché ako zahnuté :)

Nahoru Odpovědět 13.8.2014 18:19
www.samuelillo.com; lamka02sk(zavináč)samuelillo.com, www.point.samuelillo.com, www.csgorig.eu
Avatar
Odpovídá na Honza Bittner
Michal Žůrek (misaz):

pokud má jednobarevné pozadí, tak to není problém.

Nahoru Odpovědět 13.8.2014 18:39
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

Pap přijde příkaz: "hele, dej mi na pozadí tuto" ... A bude v háji. :)

Lepší je to udělat tak, aby s tím neměl v budoucnu problémy. ;)

Editováno 13.8.2014 18:42
Nahoru Odpovědět 13.8.2014 18:41
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Odpovídá na Honza Bittner
Michal Žůrek (misaz):

no tak pak do budoducna přemýšlet o clip nebo použít SVG, které by dnes mělo clip umět.

Nahoru Odpovědět 13.8.2014 18:42
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

Stále tu je však problém se staršími prohlížeči. :/

Nahoru Odpovědět  +1 13.8.2014 18:43
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Jiří Gracík:

Nemyslím si, že tohle je zrovna ideální příklad na použití SVG. Pokud by prohlížeč SVG nezvládl, tak bude stránka bez menu, což není zrovna 2x žádoucí.

Nahoru Odpovědět 13.8.2014 18:45
Creating websites is awesome till you see the result in another browser ...
Avatar
Odpovídá na Honza Bittner
Michal Žůrek (misaz):

nebudu se tu s tebou hádat, dal jsem pro mobilní zařízení šťastnější variantu, pokud má jednobarevné pozadí mohl by toto klidně použít.

Nahoru Odpovědět 13.8.2014 18:46
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Honza Bittner:

Nevidím, že bychom se hádali. :)

Určitě je to uspokojivé řešení pro jednobarevné pozadí, to ano.

Btw. SVG nějaké prohlížeče nezvládají, CSS3 taktéž ne. Je proto nutné tvořit vše, minimálně tedy klíčové části webu, tak, aby fungovali i na starých prohlížečích, tedy IE8+.

Nahoru Odpovědět  +2 13.8.2014 18:50
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Odpovídá na Jiří Gracík
Michal Žůrek (misaz):

tak to ověříš javaScriptem, apk můžeš stáhnout obrázky. Obrázková varianta je úplně na nic v mobilním telefonu.
1.) na EDGE a podobných šnecích ji budeš stahovat věčnost
2.) jen těžko bude responzivní

Nahoru Odpovědět 13.8.2014 18:50
Nesnáším {}, proto se jim vyhýbám.
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Jiří Gracík:

1.) Rozumně komprimovaný asi 100kb veliký obrázek mi přijde mnohem lepší, než stahovat SVG a JavaScript, poté kontrolovat JavaScriptem zda to vůbec půjde a pak to nějak nastavovat.
2.) A jak bude SVG responzivní?

Například můj telefon, který není rád za jakýkoliv skript, by ten web neměl rád.

Editováno 13.8.2014 19:28
Nahoru Odpovědět  +3 13.8.2014 19:27
Creating websites is awesome till you see the result in another browser ...
Avatar
1Pupik1989
Člen
Avatar
1Pupik1989:

Pořád se oháníte, že HTML 4 je staré a bavíte se tu o edge? Snad spoustu lidí má 3G a zbylých 10% je jedno ne?

 
Nahoru Odpovědět  -3 13.8.2014 23:47
Avatar
Samuel Illo
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Samuel Illo :

Dávať ešte k tomu zbytočné skripty na telefón je totálny zabijak. Používateľ bude rád ak mu raz z desiatich pokusov nespadne prehliadač...

Nahoru Odpovědět  +1 14.8.2014 9:26
www.samuelillo.com; lamka02sk(zavináč)samuelillo.com, www.point.samuelillo.com, www.csgorig.eu
Avatar
Jiří Gracík
Redaktor
Avatar
Odpovídá na 1Pupik1989
Jiří Gracík:

To je dost možné, ale víme jak je to s pokrytím 3G/4G, že :)

Nahoru Odpovědět  +2 14.8.2014 9:37
Creating websites is awesome till you see the result in another browser ...
Avatar
1Pupik1989
Člen
Avatar
Odpovídá na Jiří Gracík
1Pupik1989:

S tím souhlasím. U nás Vodafone před třemi měsíci přidal na vysílač 3G, ale ještě ho nespustili. Proto používám Operu Mini, přeci jen ty data trochu zcvrkne.

 
Nahoru Odpovědět  +1 15.8.2014 7:30
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 21 zpráv z 21.