Podzimní výzdoba webu

JavaScript Základní konstrukce Zdrojákoviště Podzimní výzdoba webu

V minisoutěži Machr na Webdesign za týden 38 jsem vytvořil script, který do v podstatě jakékoliv stránky vloží na pozadí animované padající listí. Script je navržen tak, aby jeho implementace byla co nejjednodušší.

Implementace

Implementace by měla být i nejjednodušší, takže by to měl zvládnout i webmaster tupec. Probíhá ve dvou krocích.

  1. Do hlavičky head vložte link na definici animace a elementů.
<link rel="stylesheet" href="http://machr38.misaz.moxo.cz/podzim.css" />
  1. Na začátek body vložte script, který vytvoří elementy listů
<script src="http://machr38.misaz.moxo.cz/podzim.js"></script>

Tímto implementace končí.

Can I Use

Aby tento článek byl ještě užitečnější, tak vám zde popíši co se dočtete na úžasném webu caniuse.com . Při psaní podobných scriptů nebo obecně moderních webů se vám tato stránka bude hodit. V současné době jsou definice HTML5, CSS3 a EcmaScriptu 5 rozepsané a nejsou finální, což znamená, že chceme-li zajistit stejný web všem, tak je ani pomalu nesmíme používat, což je trochu hloupost.

Poznámka: EcmaScript je JavaScript. JavaScript je registrovaná obchodní značka.

Na webu caniuse se tedy dočtete, který webový prohlížeč danou "vymoženost" podporuje, či jaký vendor prefix musíme použít.

Podpora animací (použito v ukázce s listím)

Can I Use – CSS3 animace

Z předchozího obrázku vyplývá, že Internet Explorer podporuje animace od verze 10 a výš. Mozilla je podporuje plně a to i bez prefixu. Na -moz- můžete u animací již zapomenout. Většina ostatních prohlížečů (postavených na webkitu) animace podporuje jen s vendor prefixem -webkit-. Pod tabulkou jsou ještě karty. Zajímává je karta resources, na které jsou různé zdroje od dokumentace až po různé tutoriály a dema. Při psaní různých webových aplikací nebo stylování webových stránek doporučuji sledovat web Can I Use. Tedy alespoň do okamžiku, než se dokumentace stanou finálními.

Doufám, že vám tento článek byl alespoň trochu užitečným a doufám, že už se těšíte na halloween, až padajícím listím bude vyzdoben devbook.


Galerie

Program byl vytvořen v roce 2013.

 

Stáhnout

Staženo 291x (1.67 MB)
Aplikace je včetně zdrojových kódů v jazyce JavaScript

 

  Aktivity (1)

Program pro vás napsal Michal Žůrek (misaz)
Avatar
Autor se věnuje tvorbě aplikací pro počítače, mobilní telefony, mikroprocesory a tvorbě webových stránek a webových aplikací. Nejraději programuje ve Visual Basicu a TypeScript. Ovládá HTML, CSS, JavaScript, TypeScript, C# a Visual Basic.

Jak se ti líbí článek?
Celkem (3 hlasů) :
4.333334.333334.333334.33333 4.33333


 



 

 

Komentáře

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zatím nikdo nevložil komentář - buď první!