Zum Inhalt springen

Menüs basierend auf CSS

Erstellt am 7. März 2006 · 136 Antworten · letzte Antwort am 16. November 2006 · Seite 2 von 7

Tags: Frage

Unbekannter Benutzer ·

Huhu, nochmal ich - gibt es ne Möglichkeit, das "standartmäßige" t_menu layer zu umgehen? Der Source-Code ist viel zu lang(bei einer sehr tiefen Navigation). Hat jemand ne Lösung? Gibt es hier nen Ansatzpunkt? Neben dem CSS basierten Layout, wäre doch bestimmt noch was anderes denkbar?

just2b ·
AndyKöln schrieb

Huhu, nochmal ich - gibt es ne Möglichkeit, das "standartmäßige" t_menu layer zu umgehen? Der Source-Code ist viel zu lang(bei einer sehr tiefen Navigation). Hat jemand ne Lösung? Gibt es hier nen Ansatzpunkt? Neben dem CSS basierten Layout, wäre doch bestimmt noch was anderes denkbar?

und zwar was? vorschläge immer willkommen

kazi ·

Ich habe versucht das Beispiel wie nachfolgend einzubinden !

Was mache ich falsch ?

Habe den TS-Code im Setup Bereich wie folgt eingebunden:
1.

page = PAGE
page.typeNum = 0 

page.10 = TEMPLATE  
page.10 {
template = FILE
template.file = fileadmin/templates/Template-4.html
workonSubpart = DOKUMENT
marks.CONTENT < styles.content.get
}

#page.stylesheet = fileadmin/styles/styles-ie.css
page.stylesheet = fileadmin/styles/horizontal.css

page.includeLibs.gmenu_layers = fileadmin/scripts/tmenu_layers.php


headerData = COA
headerData.11 = TEXT
headerData.11.value = <script type="text/javascript" src="fileadmin/scripts/horizontal.js"></script>


page.10.marks.PRIN = HMENU
page.10.marks.PRIN {
	special = directory
	special.value = 850

	1 = TMENU
	1 {
		expAll = 1
		wrap = <ul id="nav">|</ul>
		noBlur = 1
		NO = 1
		NO.wrapItemAndSub = <li>|</li>

		IFSUB = 1
		IFSUB.wrapItemAndSub = <li class="menuparent">|</li>
		ACTIFSUB < .IFSUB
	}
	2 < .1	
	2.wrap = <ul>|</ul>

	3 < .2
	4 < .2
}

2. Im HTML-Template soll der Marker ###PRIN### ersetzt werden.
Wird auch, aber es erscheint kein Layermenü

3. Die Dateien horizontal.js und horizontal.css an die entsprechenden Stellen kopiert und die Rechte per chown angepasst.

Kann mir jemand einen Tip geben ?

Ich denke ich binde die Header Darten falsch ein ??

Zeile 18,19,20 (der Zeilenumbruch bei Zeile 20 existiert nicht Forumsoftware bricht es um)

Danke und Ciao
Kazi

just2b ·

probier mal

page {
headerData = COA
headerData.11 = TEXT
headerData.11.value = <script type="text/javascript" src="foo.js"></script>
}
kazi ·

Hallo Just2B,

danke für deine Hilfe :-)

Ich habe meinen Code auf dein anraten auf den Zeilen (10,11,12) wie nachfolgend abgeändert. Jedoch erscheint das Layermenü immer noch nicht wofür steht eigentlich nochmla diese 850 ?

page = PAGE
page.typeNum = 0 

page.10 = TEMPLATE  
page.10 {
 template = FILE
 template.file = fileadmin/templates/Template-4.html
 workonSubpart = DOKUMENT
 marks.CONTENT < styles.content.get
 headerData = COA
 headerData.11 = TEXT
 headerData.11.value = <script type="text/javascript" src="fileadmin/scripts/horizontal.js"></script>

}

#page.stylesheet = fileadmin/styles/styles-ie.css
page.stylesheet = fileadmin/styles/horizontal.css

#page.includeLibs.gmenu_layers = fileadmin/scripts/tmenu_layers.php


page.10.marks.PRIN = HMENU
page.10.marks.PRIN {
	special = directory
	special.value = 850

	1 = TMENU
	1 {
		expAll = 1
		wrap = <ul id="nav">|</ul>
		noBlur = 1
		NO = 1
		NO.wrapItemAndSub = <li>|</li>

		IFSUB = 1
		IFSUB.wrapItemAndSub = <li class="menuparent">|</li>
		ACTIFSUB < .IFSUB
	}
	2 < .1	
	2.wrap = <ul>|</ul>

	3 < .2
	4 < .2
}
kazi ·

Just2B,

danke nochmal für deine Hilfe .

Problem gelöst !!! #giggle# #giggle# #giggle#

Lag am special.value.

Die 850 musste ich durch die Root ID bei mir nämlich 16 ersetzen.

Anfängerfehler ;-)

Ciao

Kazim

kazi ·

Hallo Leute,

wie bereits in meinen letzten Posts erwähnt habe ich es mit meinem Code geshcafft das CSS Menü einzubinden. Jedoch funktioniert es nur auf dem Firefox, nicht aber im IE Version 6.0.28.

PS: Javascript ist eingeschaltet.

just2b ·
kazi schrieb

Jedoch funktioniert es nur auf dem Firefox, nicht aber im IE Version 6.0.28.

was ist es? wenn die 2.ebene nicht erscheint im IE? ist das JS auch richtig eingebunden, quellcode => stimmt der pfad

georg

littlejoe ·

Habe das CSS-menu von CSS-Play in Typo3 eingebunden erfolgreich in Firefox und IE eingbunden.

Den Typo Code findet ihr unter folgendem Post.

#436414

Gruß LittleJoe
[/url]

flowtime ·

hallo, erstmal danke für das menü,allerdings hab ich ein problem. ich hab alles wie beschrieben eingerichtet, bekomme aber bei den menüpunkten ohne unterpunkte nen zeilenumbruch nach dem a-tag... also so ->
<li><a href="47.0.html">Ansprechpartner</a><br></li>

kann mir jemand erklären wo das herkommt?
wie gesagt, es schaut alles so aus wie im ersten post beschrieben...

schonmal danke!

mve2602 ·

mich würde sehr interessieren, wie das Menu als Gmenu realisiert wird.
Momentan sieht der Code so aus, allerdings funktioniert es nur im IE 6
richtig. Im Firefox passiert gar nix.
Wäre lieb, wenn mir da jemand weiterhelfen könnte, leider gibt es ja bei Gmenus kein "wrapItemAndSub" :-(

temp.gmenu-2 = HMENU 
temp.gmenu-2{ 
special = directory
special.value = 20
#entryLevel = 0 

1 = GMENU 
1 { 
	  expAll = 1
	  wrap = <ul id="nav">|</ul>
	  noBlur = 1
          NO = 1
          NO {
               ATagTitle.field = title
		 #wrap = <li>|</li>
		 wrap = <li class="menuparent">|</li>
               XY = 178, 28 |*| 84,28 |*| 84,28
               backColor = #b74249 |*| #c8706d |*| #c8706d
               50 = TEXT
               50 {
                    text.field = title
                    fontSize = 18
                    fontFile = fileadmin/template/fonts/ATRotSemSanBol.ttf
                    fontColor = #000000
		    align = left
                    offset = 18,20 |*| 3,20 |*| 3,20
                    transparentBackground = 1
               }
          } 

          ACT < .NO
	  ACT = 1	
          ACT.50.fontColor = #FFFFFF	   

          RO < .ACT
          RO = 1
  } 

2 < .1
2 = GMENU
2 {
	wrap = <ul>|</ul>
	NO = 1	
	NO {
              XY = 178, 15
	      backColor = #FFFFFF
		50 = TEXT
		50 {
		     niceText = 1
                     offset = 100,10
		     fontSize = 12
		}
	}

	ACT < .NO
	ACT = 1
	ACT.50.fontColor = #a7032f

	RO < .ACT
	RO = 1
	RO.50.fontColor = #a7032f
}
}
just2b ·

Ich habs so gelöst

marks.MENU = HMENU
marks.MENU {
	special = directory
	special.value = 158
	entryLevel = 1
	
	1=GMENU
	1 {
		wrap = <ul id="nav">|</ul>
		expAll = 1
		noBlur = 1

		NO = 1    
		NO {
			allWrap = <li>|</li>
			transparentBackground = 1
			XY=135,24
		
			10=TEXT
			10 {
				text.field=title
				offset=1,20
				fontColor=#000E31
				fontFile=fileadmin/fonts/madfont.ttf
				fontSize=11       
			}
		}
		ACT <.NO
		ACT.10.fontColor = red

		IFSUB <.NO
		IFSUB.allWrap =  <li class="menuparent">|
		IFSUB.5 = IMAGE
		IFSUB.5.file = fileadmin/listmenu/right_gmenu_no.gif

		ACTIFSUB <.IFSUB
		ACTIFSUB.5.file = fileadmin/listmenu/right_gmenu_act.gif
		ACTIFSUB.10.fontColor = red

		RO <.NO
		RO.10.fontColor = blue

		ACTRO <.RO
		ACTIFSUBRO <.RO
		ACTIFSUBRO.5 = IMAGE
		ACTIFSUBRO.5.file = fileadmin/listmenu/right_gmenu_actifsubro.gif

		IFSUBRO <.ACTIFSUBRO

	}

	2 = TMENU
	2 {
		wrap  = <ul>|</ul></li>
		expAll = 1
		noBlur = 1

		NO = 1  
		NO.allWrap = <li>|</li>

		ACT <.NO
		ACT.allWrap = <li class="nav2act> |</li>

		IFSUB = 1
		IFSUB.allWrap =  <li class="menuparent">|

		ACTIFSUB = 1
		ACTIFSUB.allWrap =  <li class="menuparent">|

	}
	3 <.2	
}

georg

jonny-depp ·

Im firefox wird bei mir die Seite richtig angezeigt. Aber im Internet Explorer wird kein aufklappendes Menü gezeigt.
Ich habe mal zwei Printscreens gemacht.

Kennt jemand dieses Problem?

Ich hab mal noch die TS-Konfiguration angehängt.

Bild: s2.bilder-hosting.de/…/SL8T6.jpg

Bild: s2.bilder-hosting.de/…/SLDM9.jpg

heady = COA
heady.11 = TEXT
heady.11.value = <script type="text/javascript" src="fileadmin/page/Javascript/horizontal.js"></script> 
seite = PAGE
seite.typeNum = 0
seite.includeLibs.gmenu_layers = media/scripts/gmenu_layers.php
seite.includeCSS {
     file1 = fileadmin/page/hp.css
     file2 = fileadmin/page/navigation.css
      } 
seite.10 = TEMPLATE
seite.10 {
   template = FILE
   template.file = fileadmin/page/page.html
   workOnSubpart = CONTENT
   marks.DOCUMENT < styles.content.get 
 marks.MENUE = HMENU
marks.MENUE {
	special = directory
	special.value = 4

	1 = TMENU
	1 {
		expAll = 1
		wrap = <ul id="nav">|</ul>
		noBlur = 1
		NO = 1
		NO.wrapItemAndSub = <li>|</li>

		IFSUB = 1
		IFSUB.wrapItemAndSub = <li class="menuparent">|</li>
		ACTIFSUB < .IFSUB
	}
	2 < .1	
	2.wrap = <ul>|</ul>

	3 < .2
	4 < .2
}
}
jonny-depp ·

im html-quellcode nicht, aber im TS-Code.

gehört im HTML noch etwas hin?

Mein momentaner Stand:

<!--###CONTENT###-->
<div class="wrap">
	
<div class="header"> </div>
 <table boarder="0">
	<tr>
		<td width="780">
			<div class="topnav" id="nav">
				###MENUE###
			</div>	
		</td>
	</tr>
	
	<tr>
		<td>
			<div>
				<table boarder="0" width="780">
					<tr>
						<td>
							<img src="fileadmin/page/images/blank.gif" width="30" height="0" border="0" alt="" />
						</td>
					
						<td>
							###DOCUMENT###
						</td>
						
						<td>
							<img src="fileadmin/page/images/blank.gif" width="30" height="0" border="0" alt="" />
						</td>
					</tr>
				</table>
			</div>
		</td>
	</tr>
</table>


<!--###CONTENT###-->
just2b ·

nun dann stimmt der pfad nicht oder nicht wie es eingebunden wird 😉

page.headerData ...

georg

jonny-depp ·

habe mal folgendes versucht:

seite.header = COA
seite.header.11 = TEXT
seite.header.11.value = <script type="text/javascript" src="fileadmin/page/Javascript/horizontal.js"></script>

mit dem Firefox funktionierte es.
Leider mit dem Internet Explorer leider nicht.

mve2602 ·

Vielen Dank Georg für deine Hilfe, habe es noch ein klein wenig an meine Bedürfnisse anpassen müssen und es läuft einwandfrei ;-)

Hier noch einmal das Typoscript für alle, die ein reines Gmenu auf Basis dieses Listenmenus realisieren möchten.

...
page = PAGE
page {
	headerData.30 = TEXT
	headerData.30.value = <script type="text/javascript" src="fileadmin/template/scripts/horizontal_JS.js"></script> 
}
...
# Dynamisches Grafikmenu der shop Ebene

temp.gmenu-2 = HMENU
temp.gmenu-2 {
    
  special = directory
  special.value = 20
  excludeUidList = 29
        
    1 = GMENU
    1 {
      wrap = <div id="gmenu-2"><ul id="nav">|</ul></div>
      expAll = 1
      noBlur = 1
  
       NO = 1    
       NO {
 
            allWrap = <li>|</li>
            XY = 168, 28 |*| 84,28 |*| 84,28
            backColor = #b74249 |*| #c8706d |*| #c8706d

                50=TEXT
                50 {
                    text.field = title
                    fontSize = 16
                    fontFile = fileadmin/template/fonts/ATRotSemSanBol.ttf
                    fontColor = #FFFFFF
		    align = left
                    offset = 15,20
                    niceText = 1
                 }
       }
         
       ACT <.NO
       ACT.50.fontColor = #000000
 
       IFSUB <.NO
       IFSUB.allWrap =  <li class="menuparent">|

       ACTIFSUB <.IFSUB
 
       RO <.ACT
 
       ACTRO <.RO
       ACTIFSUBRO <.RO
 
       IFSUBRO <.ACTIFSUBRO

   }
 
   2 = GMENU
   2 {
     wrap  = <ul>|</ul></li>
     expAll = 1
     #noBlur = 1
 
      NO = 1  
      NO {               

        allWrap = <li>|</li>
        XY = 83, 25
	backColor = #b74249 
						
                50 = TEXT
		50 {
		text.field = title
        	niceText = 1
	        offset = 15,18
        	fontColor = #FFFFFF
		fontSize = 14
               	fontFile = fileadmin/template/fonts/ATRotSemSanBol.ttf	
                }
 
        ACT <.NO
        ACT.allWrap = <li class="nav2act> |</li>

        IFSUB = 1
        IFSUB.allWrap =  <li class="menuparent">|

        ACTIFSUB = 1
        ACTIFSUB.allWrap =  <li class="menuparent">|
                
        RO < .NO
        RO = 1
        RO.backColor = #c8706d
    }
    3 <.2   
}

Das einzige, was mich jetzt noch richtig glücklich machen würde, wäre eine kleine Optimierung für Suchmaschinen. Und zwar ein Title-Tag im A-Tag. Habe hier im Forum schon einiges zu diesem Thema gefunden, allerdings hat es bei mir nie bei GMENU´s gegriffen.

Vielen Dank an alle Interessierten.

jonny-depp ·

Habs herausgefunden ;-)

Der Header muss so sein.

seite = PAGE
seite {
       headerData.30 = Text
       headerData.30.value = <script type="text/java......">
}
...

Ist mir gar nicht aufgefallen #paralyzed#

Danke vielmals für die Hilfe.

NetPartyzan ·

Erstmal schönen Dank für die bereitstellung dieses super schlanken Menus 8-)

Habs gleich mal auf diversen Browsern getestet, leider hat die Beta 2 vom IE7 derzeit Probleme (Betrifft vertikale Version). Hoffen wir mal das dieser Bug noch gefixt wird , Problem ist bei MS schon gepostet worden.

Lösung des Probs: definition Höhe der Listenelemente

MfG Jo