Seite 1 von 3 1 2 3 LetzteLetzte
Ergebnis 1 bis 10 von 24

Thema: Menüpunkte verschieden formatieren

  1. #1
    xon
    xon ist offline
    Verbringt hier viel Zeit Avatar von xon
    Registriert seit
    09.07.2006
    Ort
    Solingen
    Beiträge
    728
    Bedankte sich
    28
    Erhielt 126 Danksagungen
    in 117 Beiträgen

    Standard Menüpunkte verschieden formatieren

    Habe lange überlegt wie ich die einzelnen Menüpunkte eines Menüs unterschiedlich gestalten kann. Zum Beispiel: Menüpunkt1 = rot, Menüpunkt2 = gelb, Menüpunkt3 = violet, etc.,- Und wenn man darauf klickt: Menüpunkt1 = hellrot, Menüpunkt2 = hellgelb, Menüpunkt3 = hellviolet..

    Das Magicmenü bietet zwar die Möglickeit prinzipiell an, weil es im Menüpunkt die Item_Id mit übergibt, ich konnte aber nicht rausfinden, wo ich das Stylesheet dazu editiere..?
    Das Magicmenü reagierte auf keinerlei Stylesheetangaben..
    Vermutlich, weil es irgendwo auf Grundeinstellungen zurückgreift.

    Also habe ich in meinem Mainmenü gesucht und bin fündig geworden, wo die "class" eingefügt werden und habe dort die Item-Id's mit angehangen.
    Das Ergebnis: Ein ganz normales Menü mit individueller ID für jeden Menüeintrag.
    Gilt auch für "active_item"

    Also: class="mainlevel_<itemid>"
    und: id="active_item_<itemid>"

    Hoffe, jemand kann damit etwas anfangen.
    Ich hänge die modifizierte /modules/mod_mainmenu/legacy.php hier an den Thread.

    Info: Alle Modifikationen veschwinden bei einem Joomla-Update und müssen erneut eingespielt werden.
    Die Datei kann einfach überschrieben werden (Vorher ein Backup machen!)

    Anstelle des Mainmenüs (mod_mainmenu) kann wahrscheinlich auch jedes andere Menü genommen werden (ungeprüft)..


    Gruß,
    XOn
    Angehängte Dateien

  2. #2
    Neu an Board
    Registriert seit
    16.02.2009
    Alter
    31
    Beiträge
    22
    Bedankte sich
    0
    Erhielt 2 Danksagungen
    in 2 Beiträgen

    Standard

    also ich hab das bei mir so gelöst... ich behaupte es is die hässlichste variante die man machen kann aber sie funktioniert...

    einfach in deine haupt CSS datei einfügen

    Code:
    ul { margin:0; padding: 0; display:block; width:190px;  margin-right:-40px; }
    
    li       {margin:0; padding:0; line-height:18px; width:190px; }
    li li    {margin:0; margin-left: 10px; padding:0; line-height:18px; width:180px;}
    li li li {margin:0; margin-left: 10px;padding:0; line-height:18px; width:180px;}
    li li li li {margin:0; margin-left: 10px;padding:0; line-height:18px; width:180px;}
    
    li a        { display:block; margin:0; padding: 0; width: 190px; border-bottom: #ccc solid 1px;}
    li li a     { display:block; margin:0; padding: 0; width: 180px;}
    li li li a  { display:block; margin:0; padding: 0; width: 170px;}
    li li li li a { display:block; width:160px;}
    
    li a:hover {border-bottom: #000 solid 1px; color:#000;}
    li li a:hover {border-bottom: #000 solid 1px; color:#000;}
    li li li a:hover {border-bottom: #000 solid 1px; color:#000;}
    
    
    span{   color:#999;
    	font-size:12px;
            line-height:10px:
    	font-family:Arial, Helvetica, sans-serif;
    	font-weight:normal;
    }
    
    span:hover { color: #000; }
    a:hover span { color: #000; }


    nach vielem nachbessern hatt ich keine lust mehr aufzuräumen, mir sei verziehn

    viel spaß

  3. Erhielt Danksagungen von:

    xon

  4. #3
    xon
    xon ist offline
    Verbringt hier viel Zeit Avatar von xon
    Registriert seit
    09.07.2006
    Ort
    Solingen
    Beiträge
    728
    Bedankte sich
    28
    Erhielt 126 Danksagungen
    in 117 Beiträgen

    Standard

    Danke für den Tipp,- ich habe es aber noch geschafft es "formal korrekt" zu lösen, indem ich den CSS Code aus diesem Thread ausprobiert habe:
    Horizontales Menü

    Aus diesem Beispiel habe ich jetzt folgendes CSS abgewandelt:

    .moduletable ul.menu li {
    float:left;
    list-style:none !important;

    }
    wobei moduletable automatisch das Modul bezeichnet (Nicht die Klasse des das Modul umgebenden Div-Layers !) und "menu" die Klasse der Menüpunkte ist.
    Die Menüpunkte wiederum müssen dann als "liste" im backend eingestellt werden - da brauchts dann auch kein magicmenü - und benötigen die Formatierung im "ul" UND im "li" Tag (siehe Code-Beispiel) !

    Ich bin sicher, dass ich Listen auch schon mit .moduletable ul { list-style: none;} formatiert habe,- und diese Angabe findet man auch häufig bei Google,- aber in diesem speziellem Falle / dem Joomla-Menü müssen UNBEDINGT beide tags angesprochen werden,- dann geht es :(
    Seltsamer Fall. Könnte evtl. am DocType liegen,- ich habe es noch nicht mit einem anderen DocType getestet.

    Wer aber nun ein "horizontales Menü / Vorgängerversion" mit Item-Id's haben möchte, der kann sich trotzdem die oben eingebundene Datei ins System kopieren. Das geht dann damit.

    Gruß,
    Xon

  5. #4
    War schon öfter hier
    Registriert seit
    06.02.2011
    Beiträge
    125
    Bedankte sich
    10
    1 Danksagung in 1 Beitrag

    Daumen hoch top

    @xon


    starke Sache funktioniert 1A




    gibts aber noch ne möglichkeit wenn ich jetzt in nem menü bin..

    wie z..B

    Menü1 (die Link-ACTIVE Hintergrundfarbe soll bleiben)
    --Menü11
    ---Menü111 (--> Wenn ich hier auf das Untermenü klick?!)

    derzeit geht es leider weg!

    siehe webseite:

    http://ap****20.bplaced.net/index.php

    würd mich über hilfe freuen^^


    und ist es möglich den Untermenüs einen Einzug zu geben aber der Hintergrundblock (Farbe) soll sich nicht verschieben.

    In der Legacy PHP gibt da ein Padding-Left für aber da schiebt es alles nach
    Geändert von Apacer20 (13.02.2011 um 19:48 Uhr)

  6. #5
    xon
    xon ist offline
    Verbringt hier viel Zeit Avatar von xon
    Registriert seit
    09.07.2006
    Ort
    Solingen
    Beiträge
    728
    Bedankte sich
    28
    Erhielt 126 Danksagungen
    in 117 Beiträgen

    Standard

    Sobald Du das Menü aufklappst wird aus "sublevel_17_main", "sublevel_18_main" und "sublevel_19_main" ca. "sublevel_17_main", "sublevel_20_main" und "sublevel_21_main".

    Den Stylesheet musst Du dafür auch eintragen, -wie für 17, 18 und 19..

    Zitat Zitat von Ap****20 Beitrag anzeigen
    ...und ist es möglich den Untermenüs einen Einzug zu geben aber der Hintergrundblock (Farbe) soll sich nicht verschieben.
    In der Legacy PHP gibt da ein Padding-Left für aber da schiebt es alles nach
    Hier macht es Sinn folgende Stylesheet zusätzlich anzulegen:
    .sublevel_18_main a {padding-left:2px; display:block;}

    (Den Link einrücken und nicht den Container)

    Gruß,
    XOn

  7. #6
    War schon öfter hier
    Registriert seit
    06.02.2011
    Beiträge
    125
    Bedankte sich
    10
    1 Danksagung in 1 Beitrag

    Standard

    das Versteh ich jetzt nicht so richtig?!
    Ich hab das jetzt alles soweit fertig gemacht aber das
    active in der ersten Ebene bleibt nicht wenn ich in die Untermenue wechsle?
    woran kann das liegen?


    wenn ich nen Visited setzte ist das ja de ganze Zeit so bis ich erst die Cookies wieder lösche oda?

  8. #7
    xon
    xon ist offline
    Verbringt hier viel Zeit Avatar von xon
    Registriert seit
    09.07.2006
    Ort
    Solingen
    Beiträge
    728
    Bedankte sich
    28
    Erhielt 126 Danksagungen
    in 117 Beiträgen

    Standard

    Zitat Zitat von Ap****20 Beitrag anzeigen
    das Versteh ich jetzt nicht so richtig?!
    Ich hab das jetzt alles soweit fertig gemacht aber das
    active in der ersten Ebene bleibt nicht wenn ich in die Untermenue wechsle?
    Richtig.
    Gegeben:
    HTML-Code:
    <pre>
    1.
      1.1
        1.1.1
        1.1.2
        1.1.3
      1.2.
      1.3
    2.
    3.
    4.
    </pre>
    Bei 1. = "_active" sind 1.1 - 1.1.3 alle eingeklappt.
    Bei 1.1.3 = "_active" kann ja 1.1 nicht mehr "_active" sein - dann ist 1.1.3 "_active".

    Soweit logisch. :"Es kann nur Einen geben.."
    Es kann ja nur ein Menüpunkt aktiv sein,- alles andere wäre seltsam, oder ?
    Darum ging es mir aber im letzten Post nicht.

    Zitat Zitat von Ap****20 Beitrag anzeigen
    woran kann das liegen?
    Ist im Joomla-SEF-Core so verankert. Schon lange.
    Und es ist eine schöne Sache, weil man den aktiven Menüpunkt hervorheben kann.
    Wenn alle Menüpunkte aktiv sein könnten, wäre es irgendwie doof, weil dann alle hervorgehoben würden..!?

    Zitat Zitat von Ap****20 Beitrag anzeigen
    wenn ich nen Visited setzte ist das ja de ganze Zeit so bis ich erst die Cookies wieder lösche oda?
    Du willst eine Cookie Abfrage ins PHP schreiben und die Klasse in Abhängigkeit eines Klicks auf den Menüpunkt setzen ?
    Ja,- bleibt bis das Cookie ungültig wird.
    Kannst Du über den Seitenaufruf steuern,- ist aber nicht so simple und dafür habe ich auch gerade kein Beispiel. Habe aber in Erinnerung dass das mal jemand hier im Forum beschrieben hatte. Wenn ich mich jetzt nicht zu sehr irre.

    Jetzt zu meinem letzten Post:
    Wenn Du das Menü aufklappst, wird ein neuer Menüpunkt der aktive.
    Gleichzeitig wird aber auch anders durchnummeriert.
    Warum weiß ich jetzt auch nicht.
    Für Dich bedeutet das, dass Du auch ein Stylesheet für die neue Nummerierung brauchst.
    Bin mir nicht sicher, ob ich damit verständlich machen kann was ich meine..?

    Erweitere einfach Dein Stylesheet, das wird sicherlich Dein Problem lösen.
    Am Besten schaust Du mal in den Quelltext der Browserausgabe und siehst Dir an, welche Menüpunkte welche ID's bekommen.

    Gruß,
    Xon

  9. #8
    War schon öfter hier
    Registriert seit
    06.02.2011
    Beiträge
    125
    Bedankte sich
    10
    1 Danksagung in 1 Beitrag

    Standard

    also ich hab in den css jetzt folgendes hinterlegt und über Mozilla-Firebug das nochmal verfolgt..
    aber es ändert sich bei der class nicht wirklich was? außer das sie von active wieder auf mainlevel_2_main geht

    HTML-Code:
    .mainlevel_2_main
    	{
    		font-size:11px;
    		line-height: 28px;
    		text-decoration:none;
    		color:#000;
    		display:block;
       		border-top:1px solid #DFE0E2;
    		width:160px;
    	}
    	
    a.mainlevel_2_main:hover
    	{
    		background:#EFF0F1;
    		color:#000;
    		width:160px;
    		text-decoration:none;
    	} 
    
    a.mainlevel_2_main:link
    	{
    		color:#000;
    		width:160px;
    		display:block;
    	}
    
    #active_menu_2_main	
    	{
    		background:#5F6470;
    		color:#FFF;
    		width:160px;
    	}
    [IMG]http://ap****20.bplaced.de/bilder/menue.jpg[/IMG]

    es würd sobald ich darunter den link anklick wieder
    die

    .mainlevel_2_main


    es könnt ja auch sein das wir aneinander vorbeireden? ;D
    Geändert von Apacer20 (15.02.2011 um 16:31 Uhr)

  10. #9
    xon
    xon ist offline
    Verbringt hier viel Zeit Avatar von xon
    Registriert seit
    09.07.2006
    Ort
    Solingen
    Beiträge
    728
    Bedankte sich
    28
    Erhielt 126 Danksagungen
    in 117 Beiträgen

    Standard

    Zitat Zitat von Ap****20 Beitrag anzeigen
    also ich hab in den css jetzt folgendes hinterlegt und über Mozilla-Firebug das nochmal verfolgt..
    aber es ändert sich bei der class nicht wirklich was? außer das sie von active wieder auf mainlevel_2_main geht


    es würd sobald ich darunter den link anklick wieder
    die

    .mainlevel_2_main


    es könnt ja auch sein das wir aneinander vorbeireden? ;D

    Ja, - haben wir am Anfang, aber jetzt habe ich nochmal Deine Frage gelesen.
    Trotzdem hast Du meine Antwort nicht geprüft.
    Vielleicht liegt es auch an Firebug,- ich mag das Ding nicht.

    Im Browser-Quelltext hat das aktive Submenü "Busklassifizierung" die Klasse "active_menu_17_main".
    Die sehe ich in Deiner css oben nicht ?
    Aber die musst Du halt formatieren,- ebenso alle anderen aktiven Submenüs...

    Gruß,
    XOn

  11. #10
    War schon öfter hier
    Registriert seit
    06.02.2011
    Beiträge
    125
    Bedankte sich
    10
    1 Danksagung in 1 Beitrag

    Standard

    ich hab die anderen ja auch alle formatiert.. aber den gesamten css kann ich dir hier net reinposten weil das zu lang ist!

Seite 1 von 3 1 2 3 LetzteLetzte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein