Ako otvárať celoobrazovkový div z dlaždicových boxov pomocou jQuery

Zobrazíte (trebárs) pár boxov ako dlaždice. Potom chcete, aby sa kliknutím „roztvorili“ a zobrazili ďalší obsah sa cez celý viewport „fullscreeen“. Nechce sa vám pridávať na každý box IDčko, nechce sa vám na ne vešať priamo javascript na otváranie a nechce sa vám aj do otvorených boxov pridávať tlačítka a na ne zasa javascript. Pomocou jQuery ide potrebné akcie zavesiť aj na rad boxov za sebou, stačí im len príslušne dať CSS triedy. Efekt plného zobrazenia boxu na viewporte je zasa vec trochy CSS.

HTML je teda len rad DIVov za sebou, kde je vložený aj ďalší, v defaulte skrytý box s pokračovaním obsahu. V CSS hlavne definujem vzhľad dlaždíc a vnútorný skrytý DIV zobrazovaný tak, aby prekryl celý viewport. Pre dané riešenie len ilustratívne vizuálne veci.

Samotný javascript už robí samotnú fintu: prebehne divy, zavesí na ne akciu spúšťanú kliknutím na konkrétny div. Tou je „otvorenie“ skrytého divu prísluchajúcemu tej dlaždici, na ktorú sa klikne. Zároveň zavesí na otvorený fullscreen DIV aj funkciu na jeho zatvorenie.