V poslednej dobe sa na webových stránkach začalo objavovať dynamické a animované menu, ktoré zmení veľkosť pri posúvaní obsahu nadol – minimalizácia hlavnej navigácie, aby zostalo viac miesta pre samotný obsah. V tomto príklade si ukážeme, ako si môžete vytvoriť animované menu s HTML5, CSS3 a len s pár riadkami jQuery.
Author Archives: AYRIS
Vyskakovacie okno (modal window) pomocou CSS3 a HTML5
Modal boxy sú často používaným nástrojom v internetovom arzenále webového vývojára. Používajú sa na veľa rôznych vecí: napr. na formuláre prihlásenia / registrácie, zobrazenie reklamy alebo obrázkov / videa, prípadne na oznámenia / upozornenia pre užívateľa.
Ako vytvoriť a používať stĺpce v CSS3
S rastúcou rozmanitosťou veľkostí monitorov nie je praktické navrhovať jednotlivé bloky textu, ktoré zaberajú celú šírku bloku. Tradičné riešenie je rozdeliť text do stĺpcov ručne – čo je veľmi časovo náročné, prípadne rozdeliť text dynamicky pomocou JavaScript, ktorý ale nefunguje univerzálne.
Výber farby (color picker) z obrázka v HTML5 Canvas
Vytváranie Canvas aplikácií je jedna z nových vecí, ktorá si postupne hľadá svoje miesto u vývojárov webových aplikácií, ktorí by sa radi „odosobnili“ od action scriptu vo Flashi. Pomocou Canvas môžeme vytvárať aj online hry, je to podporovaný vo všetkých hlavných prehliadačoch (v desktopových aj mobilných) a vytvára nové riešenia ako pri použití Flash.
Responzívny design: ako ho najrýchlejšie vytvoriť?
Nie je žiadnym tajomstvom, že mnohí ľudia vidia vo webe budúcnosť. Vytvorenie responzívneho designu znamená, že je schopný sa adaptovať na mnoho rôznych prehliadačov a veľkostí, ktoré sú k dispozícii. Ak sa chcete ubezpečiť, aby sa vaše webové stránky vytvorené na desktope zobrazovali na tablete s minimálnym posúvaním a zväčšovaním – budete mať záujem vytvoriť ústretový a adaptibilný web.
Ako vytvoriť parallax efekt web stránky v CSS
Tento článok ukazuje, ako pomocou CSS transformácie, perspektívy a nejakých scale trikov vytvoríme len z čistého CSS parallax efekt web stránky pri scrolovaní.
Ako vytvoriť animáciu v CSS3: prvé kroky
V CSS3 sú dva spôsoby, ako vytvoriť animáciu: CSS Transitions, ktoré nám umožňujú vytvoriť niektoré jednoduché efekty (ako je napr. :hover) alebo CSS Animations, prostredníctvom ktorých môžeme vytvárať zložitejšie efekty. Zdá sa vám, že vytvorenie peknej animácie len s použitím čistého CSS je nemožné? Od doby, čo CSS podporuje keyframes – sa môžeme priblížiť animáciam, aké sme doteraz poznali len z Adobe Flash alebo After Effect. V tomto článku si ukážeme základy animácie v CSS3.
Jednoduchý parallax efekt web stránky pomocou CSS
V tomto článku sa pozrieme na to, ako vytvoríme pekný parallax efekt webstránky jednoduchým posúvaním obsahu stránky pri zmenách statického pozadia.
10 CSS selectorov, ktoré by nemali chýbať vo vašom CSS
Zakaždým, keď sa píšeme akékoľvek CSS – používame selektory. Ale aj napriek tomu, CSS selektory sú jedným z najviac zanedbávaných častí špecifikácie.
Ako vytvoriť vyskakovacie okno s jQuery a dialog() widget
Potrebujete vytvoriť vyskakovacie okno alebo iné dialógové (plávajúce) okno pomocou jQuery? Dialog() Widget v knižnici jQuery UI umožňuje ľahko vytvoriť vyskakovacie okno, ktoré bude robiť presne to, čo chcete. V tomto článku si povieme, ako použiť jQuery dialog().