Menu - każdy przycisk inny?

[belzewub133]

Witam, chciałbym się zorientować czy istnieje możliwość podkładu (grafiki pod przycisk) ale nie chodzi mi o jednolite podłożenie jednej grafiki pod wszystkie pozycje menu lecz każda inna. Jak tego dokonać

[KYCu]

Witaj,

Zajrzyj tutaj http://extensions.joomla.org/extensi...ms/image-menus
fakt, jest kilka rozwiązań płatnych ale może coś Cię zainteresuje.

[ppilus]

Istnieje. Musisz w css opisać każdy item menu osobno. Przydatny firebug.

[pyziak]

zajrzyj TU może znajdziesz coś co Ci będzie pasować

--edit---
Jeju jak wy szybko piszecie

[KYCu]

@ppilus też ma rację ;), mój sposób wydaje się być łatwiejszy, drugi zaś trzeba znać css i umieć czytać kod strony

btw cześć @ppilus i @pyziak

[belzewub133]

yyyy a tak troszkę jaśniej jeśli istnieje jakaś możliwość? hehe
Tzn chce wrzucić na stronke aby każdy link miał inną grafikę (podkład) czytam o css wzdłuż i wszerz i jakoś nie mogę nic konkretnego znaleźć

[Utar]

nie wiem czy dobrze zrozumiałem ale przecież w joomli standardowo możesz przypisać obrazek do pozycji menu. w parametrach ustawiasz łącze graficzne i masz same obrazki w menu.

[caliber]

W pliku i index.php wpisujesz <jdoc:include type="modules" name="left" style="xhtml"/> - to chyba jest jasne.
Natomiast w css może być np. to (menu poziome):


.menu{
float: left;
overflow: visible;
height: 46px;
width: 900px;
text-shadow: 3px 3px 5px #CCCCCC;
}

ul.menu li{
list-style-type: none;
float: left;
width: 150px;

}

ul.menu li a{
display: block;
padding: 0 0 0 0;
text-decoration: none;
color: #FFFFFF;
height: 46px;
outline: none;
font-size: 13px;
font-family: "Lucida Sans Unicode", Verdana, sans-serif;
font-weight: bold;
text-transform: uppercase;
text-align: center;
line-height: 35px;
}


ul.menu li li a{
width: 150px;
height: 46px;
padding: 0 0 0 0;


}

ul.menu li li:hover{
border-top-style: none;
background: #336699;

}



ul.menu li ul{
overflow: hidden;
display:none;
}

ul.menu li:hover ul{
position: absolute;
background: #336699;
border:1px solid #000000;
display: block;
padding:0;
width: 150px;
z-index: 1;
}

.item1 a { background: url('../images/wiatraki_03.jpg') no-repeat; }
.item2 a { background: url('../images/wiatraki_04.jpg') no-repeat; }
.item3 a { background: url('../images/wiatraki_05.jpg') no-repeat; }
.item13 a { background: url('../images/wiatraki_.jpg') no-repeat; }
.item14 a { background: url('../images/wiatraki_.jpg') no-repeat; }
.item16 a { background: url('../images/wiatraki_06.jpg') no-repeat; }
.item6 a { background: url('../images/wiatraki_07.jpg') no-repeat; }
.item7 a { background: url('../images/wiatraki_08.jpg') no-repeat; }

.item1 a:hover {background-image: url('../images/wiatraki_03b.jpg');}
.item2 a:hover {background-image: url('../images/wiatraki_04b.jpg');}
.item3 a:hover {background-image: url('../images/wiatraki_05b.jpg');}
.item13 a:hover {background-image: url('../images/wiatraki_.jpg');}
.item14 a:hover {background-image: url('../images/wiatraki_.jpg');}
.item16 a:hover {background-image: url('../images/wiatraki_06b.jpg');}
.item6 a:hover {background-image: url('../images/wiatraki_07b.jpg');}
.item7 a:hover {background-image: url('../images/wiatraki_08b.jpg');}

#itema a{

width: 980px;
height: 52px;
float : left;
}

Grafikę musisz sam sobie podstawić.