Č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í.
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.