Diskuze: Machr na webdesign – responzivní lightbox

HTML a CSS HTML a CSS Machr na webdesign – responzivní lightbox American English version English version

Avatar
Michal Žůrek (misaz):

Vítám Vás u minisoutěže Machr, tentokrát na Webdesign. Vašim cílem bude připravit stylesheet, který nastyluje HTML lightboxu, tak aby všude vypadal stejně dobře = byl responzivní. Zkuste si rozevřít nějaký lightbox (třeba aktuální obrázek placky) na mobilu a uvidíte, že většina to moc nechápe. JavaScriptovou stranu tentokrát nebudeme vůbec řešit, dokonce ani HTML. Váš script by měl ostylovat toto HTML lightboxu.

<div class="lb">
        <div>
                <div class="lbBox">
                        <img src="...">
                        <button class="lbMoveButton lbMoveRight" style="display: block;">&gt;</button>
                        <button class="lbMoveButton lbMoveLeft" style="display: block;">&lt;</button>
                        <button class="lbCloseButton">×</button>
                </div>
        </div>
</div>

Zájemci, kteří nevědí co s časem nebo chtějí bonusové body, si můžou do HTML přidat třeba popisek.

K řešení můžete samozřejmě použít nějaké preprocesory, ale v takovém případě přibalte i vygenerované CSS. Deadline si dejme na sobotu 8. listopadu v 10:00. Odkaz řešení v zazipované složce (soubor *.zip) ať to nemusím rozbalovat 3rd party aplikací posílejte zde nebo Michal Žůrek do PM. Kompletní pravidla: http://www.itnetwork.cz/…outezi-machr

Editováno 2.11.2014 12:24
Odpovědět  -4 2.11.2014 12:23
Nesnáším {}, proto se jim vyhýbám.
Avatar
Odpovídá na Michal Žůrek (misaz)
Michal Žůrek (misaz):

můžu se zeptat, proč to mínusujete?

Nahoru Odpovědět  -1 2.11.2014 16:57
Nesnáším {}, proto se jim vyhýbám.
Avatar
Fredep
Redaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Fredep:

Poslední dobou se tu všechno mínuskuje... :`

Nahoru Odpovědět  +6 2.11.2014 17:07
Týmová práce je důležitá proto, aby bylo možno obvinit z neúspěchu někoho jiného.
Avatar
IT Man
Redaktor
Avatar
Odpovídá na Fredep
IT Man:

Ale ne pro nic za nic. Každé mínus má své důvody. A tímhle důvodem je zřejmě minulé hodnocení machra na algoritmy. :)

Editováno 2.11.2014 17:15
Nahoru Odpovědět  +8 2.11.2014 17:13
Když nevíš jak dál, podá ti ruku někdo, od koho by jsi to nečekal. A tu šanci musíš přijmout!
Avatar
Matúš Petrofčík
Šéfredaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Matúš Petrofčík:

Riesenie tohoto machra by mohlo realne prospiet tejto sieti a aj vsetkym projektom ktore potrebuju lightbox (fancybox, ...). :)
Za mna mas plus.

Nahoru Odpovědět  +2 2.11.2014 18:00
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Jiří Gracík
Redaktor
Avatar
Jiří Gracík:

Moc nerozumím zadání, proč tam je ta ukázka html a jesli se to musí udělat podle ní. Stačilo by to nechat volnější a říct jednoduše - Udělejte lightbox

Nahoru Odpovědět  +3 2.11.2014 18:15
Creating websites is awesome till you see the result in another browser ...
Avatar
Odpovídá na Jiří Gracík
Michal Žůrek (misaz):

snažil jsem se to zjednodušit na tu CSSkovou část. Kdybych napsal Udělejte lightbox tak dostanu vynadáno, že je to složité a časově náročné. Samozřejmě kdo chce si může i HTML a JS část udělat sám.

Nahoru Odpovědět  -1 2.11.2014 18:19
Nesnáším {}, proto se jim vyhýbám.
Avatar
Matúš Petrofčík
Šéfredaktor
Avatar
Odpovídá na Michal Žůrek (misaz)
Matúš Petrofčík:

ak ti teda pribalíme vlastnú html štruktúru s vlastným/upraveným lightbox-om a vlastným css, všetko funkčné, pripravené na otvorenie a zhodnotenie, bude sa to hodnotiť ako porušenie zadania alebo nie?

Nahoru Odpovědět  ±0 2.11.2014 18:26
obsah kocky = r^2 ... a preto vlak drnká
Avatar
Odpovídá na Matúš Petrofčík
Michal Žůrek (misaz):

samozřejmě že ne, můžeš to udělat jak chceš s čím chceš. Pokud to bude lightbox splní to zadání.

Nahoru Odpovědět  ±0 2.11.2014 18:34
Nesnáším {}, proto se jim vyhýbám.
Avatar
Jiří Gracík
Redaktor
Avatar
Nahoru Odpovědět  +2 2.11.2014 18:47
Creating websites is awesome till you see the result in another browser ...
Avatar
Michal Žůrek (misaz):

Tentokrát to máme bez řešení. :(

Akceptované řešení
+20 Zkušeností
Řešení problému
Nahoru Odpovědět  ±0 8.11.2014 21:20
Nesnáším {}, proto se jim vyhýbám.
Avatar
Honza Bittner
Redaktor
Avatar
Nahoru Odpovědět  +1 9.11.2014 1:30
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
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 12 zpráv z 12.