Felhasználói eszközök

Eszközök a webhelyen


egyetem:webc2:css3_1:f2:feladat

Animált menü

Feladat

A megadott forrás felhasználásával készítsük el a CSS formázást. Használjunk fel CSS3-as elemeket a megjelenítéshez.

Specifikáció

  1. Elkészítendő megjelenés:
    Menü megjelenése az első menüpont megnyitásával
  2. Ne változtassuk meg a BODY részt, csak a HEAD részt módosítsuk!
  3. oldal háttérszíne: #666
  4. Háttéren középen felül egy körkörös színátmenet (#444 → #111)
  5. Menük színei (Háttér,Szöveg,Szöveg árnyék)(#7da315,#3d4f0c,#99bf31)(#1e8bb4,#223a44,#44a8d0)(#c86c1f,#5a3517,#d28344)(#d0a525,#604e18,#d8b54b)(#af1e83,#460f35,#d244a6)
  6. Animálás: 0.25s
  7. Menük keretének árnyéka egér ráhelyezéskor: 10px #9ddff5
  8. Menük háttérképe: menukep.jpg; Alapból a felső sor jelenjen meg.
  9. Menüre helyezett egér hatására a menükép változzon az alsó sorban lévő azonos képre.

Megoldás

Az itt megjelenített megoldást lehetőleg csak arra használja, hogy segítséget nyerjen a feladat megfogalmazásának megértésére, de ne használja a program kódját az Ön által elkészítendő program kódjának megírásához! A másolással csak magát csapja be és megfosztja magát a szoftver fejlesztési képességének fejlődésétől!

Megoldás megtekintése

A forráslistát csak akkor tekintse meg, ha már végrehajtotta önálló munkával az adott feladat kidolgozását. Az itt megtekinthető megoldás csak segítség arra vonatkozólag, hogy milyen egy elkészített megoldás amely lefedi a feladat kiírásban foglaltakat maradéktalanul. Tudjuk, hogy egy kiírt feladat megoldáshoz számtalan formában juthatunk el, így ha az Ön megoldása megfelel a feladat kiírásban megfogalmazottaknak, akkor tökéletesen végrehajtotta a célt! Az, hogy egy kód mennyire optimális az már a fejlesztő tudásától, gyakorlatától és tapasztalatától függ, minél többet gyakorolja a fejlesztést annál inkább optimálisabb kódot fog készíteni.

Elkészített program forráskódja

egyetem/webc2/css3_1/f2/feladat.txt · legutóbbi módosítás: (külső szerkesztés)