Top subiecte apreciate

Optiuni experimentale
  • Foloseste AJAX in formulare ori de cate ori este posibil

Navigare rapidă

Ultimele subiecte
» Serie Tutoriale CSS
Scris de Hachiy Dum 15 Ian - 16:59
» Wireless ipb theme [punBB]
Scris de vi01239984564 Mar 10 Ian - 11:50
» Summer v1.1 theme
Scris de vi01239984564 Mar 10 Ian - 9:57
» Va place acest forum? [Subiect Unic]
Scris de Andrei34 Vin 6 Ian - 0:21
Cuvinte-cheie

punbb  animate  Bara  menu  tutorial  phpBB2  edit  ultimele  Metin2  Mesaje  profil  subforumuri  chenar  reclama  drop  legenda  html  banner  tema  meniu  Statistici  cautare  radio  navigare  avatar  subiecte  

Meniu layout


1.Creati un document cu dimensiunile 1024×140.
Colorati backgroundul cu culoarea neagra .
2.Folosind Rectangular Marquee Tool faceti o selectie, pe care sa o "umpleti" cu culoarea alba, ca in imaginea de mai jos:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


3.Acum apasati click dreapta pe layerul dreptunghiului si selectati Blending Mode, cu setarile:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.

Apasati pe gradient si setati culorile astfel:



4.In aceasi fereastra, aplicam stroke, cu setarile:
Color: 3E3E3E

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


Ar trebui sa arate cam asa pana acum:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


5.Folosind Rectangular marquee tool faceti o selectie, ca in exemplul de mai jos, si umpleti-o cu culoarea #000000:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.

Micsorati opacitatea la 26%.

6.Acum vom adauga niste linii pentru a divide meniul.
Apasati tasta Z penru a va duce la zoom, si mariti documentul...faceti o selectie de 2px si umpleti-o cu culoarea #FFFFFF:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


7.Click dreapta > blending mode cu setarile:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.

Apasati pe Gradient pentru a-l modifica astfel:


8.Setati Opacity tu 55%.

Asta trebuie sa aveti pana acum:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


9. Impartiti meniul in cate parti aveti nevoie, iar de fiecare data cand faceti o linie de despartire urmati pasul 7:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


10.Acum trebuie sa adaugam textul...Eu am folosit culoarea #828282 pentru link-urile care nu sunt "apasate", iar culoarea link-ului cand
il vei apasa va fi: #0987b7


Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


11.cu rectangular marquee tool faceti o selectie ca in imagine:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


Umpleti selectia cu culoarea alba, schimbati opacitatea la 56%, Blending Optinons schimbati la Overlay:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.


12.Suntem aproape de final.
Faceti o selectie a link-ului "apasat (la mine este link-ul Matches) si umpleti selectia cu culoarea #0987b7
Schimbati Blending Mode la Color.

13.Click dreapta > Blending options, cu setarile:

Mareste aceasta imagineRedu aceasta imagine Click aici pentru a o vizualiza la dimensiunea originala.



Rezultatul final:
http://i44.tinypic.com/21enhbd.jpg

Comentariile utilizatorilor
Membru dedicat
la data de Joi 23 Ian - 18:28
mr.franta Membru dedicat
Conectat
Inredibil de frumos
Membru activ
la data de Vin 24 Ian - 18:16
Teed Membru activ
Conectat
Foarte bun tutorial, bravo!
Membru ET
la data de Lun 9 Iun - 15:56
WDC./ Membru ET
Conectat
Interesant tutorialul. Felicitari .
Membru premium
la data de Dum 22 Iun - 14:44
Hissae2 Membru premium
Conectat
Este la fel ca toate meniurile, mai invata.
Membru ET
la data de Lun 30 Iun - 18:59
Typlo Membru ET
Conectat
Un meniu simplu şi elegant, felicitări!
Admin & Dezvoltator
la data de Lun 30 Iun - 20:34
SSYT Admin & Dezvoltator
Conectat
Foarte frumos pacat ca eu nu le mai am cu partea de design