Willkommen, Besucher. Um Beiträge zu schreiben bitte vorher anmelden bzw. registrieren.

[gelöst] Vertikales Menü als Drop Menü in Joomla
(1 Leser) (1) Besucher
Zum Ende gehenSeite: 1
THEMA: [gelöst] Vertikales Menü als Drop Menü in Joomla
**
#18892
[gelöst] Vertikales Menü als Drop Menü in Joomla 10.03.2010 11:08 Karma: 205
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

ralle632
Der Webseitenverunstalter
Moderator
Beiträge: 2974
graph
Benutzer offline Hier klicken, um das Profil dieses Benutzers zu sehen
Geschlecht: männlich www.ralle632.info Ort: Braunschweig Geburtstag: 08.02.1963
Letzte Änderung: 11.03.2010 11:40 von ralle632.Grund: Anweisungen angepasst
Kein öffentlicher Schreibzugriff erlaubt, bitte erst registrieren!
Besten Gruss vom Ralf ... Bitte gelöste Themen markieren
Den ersten Beitrag [ändern] im Thema öffnen ... Vor dem THEMA-Titel ein: [gelöst] setzen ... auf [Absenden] gehen ... fertig!
Bitte keine Supportanfragen mehr über PM stellen! ... achja noch eins ... KEINEN SUPPORT für den IE6 mehr
 
#18936
Aw: [gelöst] Vertikales Menü als Drop Menü in Joomla 11.03.2010 11:55 Karma: 205
Für Alle die das schon ausprobiert haben und festgestellt haben, das beim Hover und Active noch Unstimmigkeiten vorhanden sind, habe ich die Anweisungen ein wenig anpepasst.

Diese letzten Anweisungen müssen auf jedenfall dem eigenen Template angepasst werden.
Mit ein wenig Grundkenntnissen in CSS bekommt man also jedes vertikale Menü so hin, das es seitlich ausfährt.

Angepasst und gestestet für IE7/IE8/Firefox

Für Verbesserungen und Hinweise wäre ich auch dankbar und gehe diesen in meinen Ausführungen nach

Gruss Ralf
ralle632
Der Webseitenverunstalter
Moderator
Beiträge: 2974
graph
Benutzer offline Hier klicken, um das Profil dieses Benutzers zu sehen
Geschlecht: männlich www.ralle632.info Ort: Braunschweig Geburtstag: 08.02.1963
Kein öffentlicher Schreibzugriff erlaubt, bitte erst registrieren!
Besten Gruss vom Ralf ... Bitte gelöste Themen markieren
Den ersten Beitrag [ändern] im Thema öffnen ... Vor dem THEMA-Titel ein: [gelöst] setzen ... auf [Absenden] gehen ... fertig!
Bitte keine Supportanfragen mehr über PM stellen! ... achja noch eins ... KEINEN SUPPORT für den IE6 mehr
 
Zum Anfang gehenSeite: 1
Translator