Články autora Redakce Interval.cz
Nahrazení tečkovaného okraje při onfocus
Toto řešení ukazuje, jak opravit chybu objevující se ve Firefoxu při použití často využívané techniky Phark Image Replacement. Po kliknutí se u aktivního active/on-focus objektu objeví ve Firefoxu nehezký tečkovaný okraj. Toto řešení ho pomocí CSS odstraní.
Mapa webu
Toto řešení ukazuje, jak se dá formátovat libovolný stromový výpis.
Horizontální obrázkové menu
Klasické float-menu s obrázkovým pozadím a hover efektem. Za zmínku stojí zde použité vertikální vycentrování jednořádkového odkazu s využitím CSS vlastnosti height a line-height.
Simulace rámců 2
Pokud jste někdy chtěli skloubit výhody framu s výhodami CSS layoutu toto řešení by vám mohlo dopomoci ke kýženému cíli. Celý obsah webu je umístěn v jednom souboru, načte se tedy celá stránka a při kliknutí na položku v menu již nedochází k obnovování
Onclick menu bez reloadu i JS
Menu je zaměřeno na využití málo známé vlastnosti HTML odkazů. Opera si s tímto řešením příliš nerozumí, proto je zde použit hack, který způsobí zobrazení posuvníku. Ten je zde nežádoucí, ale menu funguje. Tento posuvník je možné překrýt několika způsoby. V IE
Vertikální dvouúrovňové obrázkové menu
Toto řešení využijeme, pokud chceme položky menu ozdobit obrázkovým pozadím. Využijeme CSS vlastnosti background-image a background-position.
Tečkovaný rámeček i pro IE
Toto řešení ukazuje, jak obejít chybu v Internet exploreru, který při malých tloušťkách zobrazuje tečkovaný okraj chybně jako čárkovaný.
Horizontální záložkové obrázkové menu
Toto řešení ukazuje, jak vytvořit působivé a plasticky působící horizontální menu, které využívá třech obrázků jako pozadí. Koncepce rozdělení obrázku na pozadí na tři části umožňuje mimo jiné využít i delší text položky v menu.
Formátování tabulek
Toto řešení ukazuje běžné i méně obvyklé způsoby formátování tabulek. Zajímavá je například možnost formátovat sloupce tabulky.
Horizontální menu s šířkou nadřazeného bloku
Toto řešení ukazuje, jak vytvořit vizuálně jednoduché, ale efektní horizontální menu s šířkou přizpůsobující se šířce nadřazeného bloku.
Odrážkové horizontální menu
Toto řešení ukazuje, jak vytvořit jednoduché horizontální menu s odrážkami různých tvarů jakoby s efektem známých „tabů“. Jeho hlavní využití je v základní navigaci nebo u jednodušších layoutů.
Horizontalní menu se zvětšením
Toto řešení ukazuje, jak vytvořit horizontální menu s efektem zvětšení při najetí kurzoru myši. Jsou zde dva příklady jeden s použitím poloprůhledného obrázku jako stínu a druhý bez jakéhokoli obrázku.
Obsah dokumentu
Toto řešení ukazuje, jak vytvořit jednoduchý obsah dokumentu. Jako základu využívá tabulky a dolní podtržení jako vodící linku. Řešení je dále možno použít i jako jídelní lístek.
Vysouvací menu – rozcestník
Toto menu využijeme, pokud potřebujeme do navigace umístit velké množství odkazů, například na různé servery, které obsahují podkategorie.
Horizontalní stínované menu
Tento příklad ukazuje jednoduché horizontální menu s efektem stínu v textu odkazů. Menu je tvořeno pouze textem bez využití obrázků. Znak oddělující odkazy v řádku může být jednoduše nahrazen jiným.