projekt bez analýzy - přizpůsobení pozic objektů

Zdroj: SOOM.cz [ISSN 1804-7270]
Autor: vosanet
Datum: 8.9.2012
Hodnocení/Hlasovalo: 0/0

Animované přizpůsobení pozic objektů na základě změny velikosti okna prohlížeče..

Než jsem se dostal k druhému projektu zajímal jsem se v tu chvíli hodně o responsive design, nebo taky rozložení které se přizpůsobí velikosti obrazovky. Seděl jsem u počítače a měnil velikost okna prohlížeče a přitom pozoroval přizpůsobující se dlaždice na Opera speed dialu.

Protože jsem nikde nemohl najít zdrojový kód tohoto speed dialu, začal jsem pracovat na svém vlastním pokusu o přizpůsobivé dlaždice pomocí javascriptu. A to se jakžtakž povedlo a zde je ukázka.

Už ani pořádně nevím jak to funguje :-/, to mě učí psát si ke kódu také dokumentaci(komentáře)!

Než jsem se k tomu dopracoval bylo hondě pokusů a abych zjistil správné rozložení popsal jsem několik stránek sešitu, kde jsem si počítal rozmístění...

Funguje to tak že:

1. při změně okna
2. zjisti rozměry okna
3. zjisti kolik máš dlaždic
4. propočítej ideální rozložení (v tom už se dnes(po půl roce) docela strácím)
5. změň pozice dlaždic

Chyby a nedostatky:

- Nedá se jednoduše nastavit minimální/pevné odsazení od dlaždic..
- Při zmenšení okna na velmi malou hodnotu se prohlížeč sekne :-/

Proč se tomu dále nevěnuji

- Musel, bych to celé předělat a nevím jestli to má smysl
- Až dnes jsem zjistil, jak funguje v css "float" a že to až na tu animaci docela vystačí, je to rozhodně přehledné, snadno se nastaví mezera a nezatěěžuje to tolik jako můj neúsporný kód.. příklad..
- Našel jsem plugin, zvaný Isotope co plně nahradí můj skript s širokou možností nastavení

Ovšem tento můj nedokonalý skrpit již používám ve svém dalším projektu, o kterém napíšu další článek...

Věděli jste o isotope pluginu, máte nápad jak ho použít? Chtěli byste skript, který bude podobný tomu mému? Snažili jste se o něco takového, nebo něco úplně jiného? :) Napište to do komentářů...