Mi mindent lehet CSS vagy CSS3-mal megcsinálni?

Itt egy CSS3 showcase például:

[link]

Animációkat nem tudsz, bizonyos egyszerű eseménykezelőket támogat a HTML (pl link, egérkattintás, egér hover). Ez a kettő a statikus oldalak felépítésére való. Tulajdonképpen nem is programnyelvek, hanem markup nyelvek.

Ennek kezdőként is simán nekimehetsz, a w3schools.com oldalról nagyon gyorsan meg tudod tanulni.

A CSS3 egy verziószém a CSS-hez. Mivel elég nagy fejlesztés volt az eddigiekhez képest, ezért kapott ilyen kiemelt jelentőséget.

A CSS harmadik verziójával a repertoárba olyan formázások kerültek, mint a transition, tranform, perspective, border-radius, animation, columns, flex,... és kikerült néhány dolog mint pl a marquee formázások.

Sajnos a régebbi böngészők (főként az IE ősi 8 és alatti) verziói nem vagy gyengén támogatják ezeket, és más böngészők is csak előtagokkal képesek használni őket (-moz-, -o-, -webkit-).

Lehet velük animációkat csinálni javascript nélkül is, de csupán egyszerűbbeket, és többnyire valamilyen beavatkozásra válaszul (:hover).

Itt a gyakorin is találsz (láthatsz) reklám bannereket. A legtöbb mozog, villog és csipog is. Mindegyiket el lehet készíteni html + css segítségével. Sőt, szerintem azzal is készültek itt mind.

Persze JS -el is meg lehet tenni ugyan ezt, bár az is ugyan azt csinálja, a CSS beállításokat módosítja. Annyi, hogy ezzel kicsit interaktívabbá lehet tenni. Például amikor van olyan banner, hogy "dobd a dárdát háromszor a tábla közepébe" vagy hasonló, akkor az inkább javascriptes. De a sima reklám bannerek, általában nem vagy csak nagyon kevés js-t tartalmaznak (főleg olyat, ami a google (vagy más) analiticet segíti a kattintás számolásban. De ezek nem szerves részei az animációnak).

Innentől kezdve pedig csak a fantáziád szab határokat:

https://www.youtube.com/watch?v=_iwXFaAB55g&list=PLTmBrIcSbw..

Ezzel a sorozattal elkészítheted életed első animált bannerét. Jó kis tutorial, nem kell értened angolul, végig visz a képek létrehozásától a CSS + HTML elkészítésén át az animációig.

---

Anonymus