Guten Morgen,
da ich ja gerne spiele und bastele habe ich mir mal eine Ergänzung für das vertikale Menü einfallen lassen, sodass die Untermenü seitlich ausfahren. Dies habe ich an mehreren Templates ausprobiert und funktionierte einwandfrei.
Die Anweisungen sind noch nicht ganz ausgereift, aber man kann sie erweitern und weiter austesten
Schritt1:
Ein Template erstellen in Artisteer 2.4 Beta ... das vertikale Menü aktivieren und unter
Vertical Menu -> Unterelement -> müssen "Ebenen" UND "Open Levels" ein Haken vor sein, also aktiviert
Schritt2:
In Joomla muss das Menü "Untermenüs immer anzeigen auf JA stehen" und in Modul-Klassen-Suffix natürlich "art-vmenu" stehen.
Schritt3:
template.css öffnen und ganz unten zusätzlich eintragen und natürlich die Werte später seinem Template anpassen, aber auch schon mit dieser Anweisung dürfte ein Erfolg zu sehen sein
| Code: |
/*DropDown Zusatzanweisungen*/
.art-vmenublock
{
z-index:1 !important;
}
ul.art-vmenu ul
{
visibility:hidden; /*verstecken der Untermenüs bis mouseover kommt*/
left:180px; /*Abstand zum Hauptmenü*/
margin-top:-30px; /*genaue Ausrichtung des ersten Untermenüs*/
position:absolute;
float:none;
width:170px; /*feste Breite des Untermenüs einstellen*/
}
ul.art-vmenu ul ul
{
left:170px; /* Position angleichen für Breite Untermenüs */
margin-top:-30px; /*genaue Ausrichtung des 2.ten Untermenüs*/
position:relative;
float:left;
}
ul.art-vmenu li:hover > ul
{
visibility:visible; /*anzeigen der Untermenüs bei mouseover*/
}
/*Diese Anweisung dient zum Einrücken, falls Bilder vor dem Link*/
/*Die Orignal Anweisung in leicht veränderter Form mit Ergänzung bis auf das 2.te Untermenü*/
/*Die Orignal Anweisung stehen für das anpassen in Eurer template.css weiter oben*/
ul.art-vmenu ul a,
ul.art-vmenu ul li li a
{
background-image:url(../images/vsubitem.gif);
background-position:5px 0;
background-repeat:repeat-x;
border:1px solid #332C28;
display:block;
height:26px;
overflow:visible;
padding-left:15px;
white-space:nowrap;
}
ul.art-vmenu ul li a.active
{
background-position:5px -52px;
}
ul.art-vmenu ul li li a.active
{
background-position:5px -52px;
}
ul.art-vmenu ul li a:hover, ul.art-vmenu ul li a:hover.active
{
background-position: 5px -26px;
}
ul.art-vmenu ul li li a:hover, ul.art-vmenu ul li li a:hover.active
{
background-position: 5px -26px;
}
/*DropDown Zusatzanweisungen*/
|
Viel Spass beim austesten wünscht Euch Ralf
Hier noch ein kleine Livedemo in meinem Privatbereich geht mal auf den Reiter "Über meine Person"
www.ralle632.info/privates/?&template=24b2_dropmenu
