Cum pot face un meniu ca asta?

**Federals** · 19th August 2008, 13:00

Am un meniu in Photoshop (deci pot sa iau usor culorile samd), dar nu stiu cum sa fac butoanele sa se repete la dreapta cu tot cu separator.

Demo-ul e in atasament.

Ma gandesc la un rezultat de genul:

<div id="menu">Home</div>
<div id="menu">About us</div>
........

Nu ma mai complic si cu dimensiunea, o sa fac un buton de dimensiuni fixe care e albastru la hover si negru in rest.

La partea cu hover-ul ma descurc

Cu repetarea in functie de cate div-uri am... aici e problema.

Ma puteti ajuta?

Mersi!

**Federals** · 19th August 2008, 13:30

Am reusit asa, in caz ca va intereseaza:

<html>
<head>
<style type="text/css">

a.menu
{
color: white;
font: 12px Arial,Helvetica,sans-serif;
text-decoration: none;
display: block;
width:97px;
height: 29px;
padding-top:8px;
text-align:center;
background-image: url('button_1.png');
background-repeat:no-repeat;
float: left;
}

a.menu:hover
{
background-image:url('button_0.png');
background-repeat:no-repeat;
font-weight: bold;
width:97px;
height: 29px;
float:left;
}

</style>
</head>
<body>
<a class="menu" href="home.html">Home</a>
<a class="menu" href="news.html">About us</a>
<a class="menu" href="menu.html">Offers</a>
<a class="menu" href="locations.html">Shipping</a>

</body>
</html>

Butoanele sunt in atasament.

**Dever** · 19th August 2008, 19:37

Vezi sliding doors aici si aici pentru dimensiuni variabile si eventual css sprites aici.

**Federals** · 19th August 2008, 20:16

Postat în original de Dever

Vezi sliding doors aici si aici pentru dimensiuni variabile si eventual css sprites aici.

mersi!

**Federals** · 21st August 2008, 14:45

sorry pentru post dublu, dar mai am o curiozitate:
cum pot sa fac ca atunci cand sunt pe o pagina, background-ul butonului paginii sa ramana albastru iar restul negre? si tot asa, cand ma plimb in fiecare pagina. se poate direct din css?

mersi!

**forapathy** · 21st August 2008, 14:56

sa ramana selectat butonul adica?

din css nu stiu sa existe aceasta posibilitate.. insa din php se poate face..

faci o clasa pentru buton asa cum e el.. si inca una cand e selectat.. si cu php verifici ce pagina e selectata si selectezi doat clasa de css de care ai nevoie..

sau daca ai doar pagini html.. pui pt fiecare pagina in parte alta clasa pt acel buton..

**Federals** · 21st August 2008, 15:28

mersi, o sa incerc

**Dever** · 21st August 2008, 16:46

Am scris recent despre asta pe blog aici.

Din css poti daca setezi un id pe body pt fiecare pagina:
Daca HTML-ul homepage-ului arata asa:

Cod:

<body id="homepage">
....
<ul>
<li><a id="home" href="link_catre_homepage">Go Home</a></li>

CSS-ul ar putea sa arate asa:

Cod:

#homepage #home { /* stil pentru butonul de pagina activ */ }

De asemenea aceeasi problema se poate rezolva din PHP setand o clasa "activ":

Cod:

//verificare pagina cumva
if ($pagina == "home")
{
     echo ' class="activ" ';
}

si CSS-ul se simplica fiind doar pt 1 clasa:

Cod:

a.activ { /* stil pentru butonul de pagina activ */ }

**CristiC** · 21st August 2008, 18:04

Uite aici unul din multele exemple de meniuri in css.

Pentru cel curent - vezi ca in cod la un moment dat apare class="current".

Poti sa te inspiri sau sa modifici direct scriptul asta si sa schimbi cu imaginile tale.

**Federals** · 21st August 2008, 18:39

mersi tuturor!

Subiect: Cum pot face un meniu ca asta?

Instrumente subiect

Afișează

Cum pot face un meniu ca asta?

Informații subiect

Utilizatori care navighează în acest subiect

Thread-uri Similare

Ajutor meniu CSS

meniu

Cum se face asta si daca e ok ?

Meniu seo friendly

Cum Leg Un Meniu?

Permisiuni postare