Hallo zusammen!
Ich möchte gerne das horizontale Dropdown-Menü von just2b (http://www.just2b.com/mein-typo3/css-ts-menues/horizontales-dropdown-menue.html)
nachbauen und anpassen.
Soweit hat es mit einigem Tüfteln auch ganz gut funktioniert. Hier der Stand der Dinge:
http://p30744.typo3server.info/9.html
Nun sollen aber die Punkte Besucher, Aussteller, Partner... nicht in blau dargestellt werden, sondern in den entsprechenden Farben der Untermenüs. Hier stoße ich an meine Grenze. Das müsste über Option Split doch zu realisieren sein, oder?
Leider komme ich nicht weiter. Bin für jeden Hinweis dankbar.
Hier mein TS:
[...]
#HAUPTNAVIGATION
marks.MENU-OBEN1 = HMENU
marks.MENU-OBEN1 {
special = directory
special.value = 2
#entryLevel = 0
#expAll=0
1 = TMENU
1 {
expAll = 1
wrap = <ul id="nav">|</ul> || <ul id="nav1">|</ul> || <ul id="nav2">|</ul> #???
noBlur = 1
NO = 1
NO.wrapItemAndSub = <li>|</li>
IFSUB = 1
IFSUB.wrapItemAndSub = <li id="nav-besucher">|</li> || <li id="nav-aussteller">|</li> || <li id="nav-partner">|</li> || <li id="nav-presse">|</li> || <li id="nav-archiv">|</li>
ACTIFSUB < .IFSUB
}
2 < .1
2.wrap = <ul>|</ul>
3 < .2
4 < .2
}
[...]
CSS:
/* Hauptnavigation oben*/
#nav, #nav ul {
float: left;
width: 100%;
display: block;
list-style: none;
height: 50px;
vertical-align: middle;
background: #0083D6;
color: #FFF;
padding: 0 0 0 0;
margin: 0 0 0 0;
xmargin: 0 0 1em 0;
text-align: center;
}
#nav1, #nav1 a{
text-align: left;
float: left;
display: block;
list-style: none;
height: 50px;
vertical-align: middle;
background: black;
color: #FFF;
padding: 0 0 0 0;
margin: 0 0 0 0;
xmargin: 0 0 1em 0;
}
#nav li li {
text-align: left;
border-left:1px solid #666666;
border-right:1px solid #666666;
border-bottom:1px solid #666666;
}
#nav a {
display: block;
width: 150px;
font: 0.9em verdana, arial, helvetica, serif;
text-align: center;
line-height: 50px;
vertical-align: middle;
color: #FFFFFF;
text-decoration: none;
}
#nav li {
float: left;
}
#nav ul li a {
color: #FFFFFF;
}
#nav li ul {
position: absolute;
left: -999em;
height: 5;
width: 12em;
font-weight: normal;
margin: 0;
}
#nav li li {
width: 12em;
}
#nav li ul a {
text-align: left;
width: 12em;
xpadding-left: 1em;
}
#nav li ul ul {
margin: -1.45em 0 0 12em !important;
margin: -1.45em 0 0 11.85em ;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
left: -999em;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
left: auto;
}
#nav li li:hover, #nav li li.sfhover {
background: #FFFFCC;
line-height: 20px;
}
#nav li li {
x background: red;
}
#nav li li:hover a, #nav li li.sfhover a {
color: #333;
}
#nav li li a {
margin-left:5px;
line-height: 20px;
}
#nav-besucher li{
background: #5AB8F7;
}
#nav-aussteller li{
background: #236997;
}
#nav-partner li{
background: #B7BD10;
}
#nav-presse li{
background: #770D0D;
}
#nav-archiv li{
background: #F15213;
}
BEST
jens
Hallo georg,
vielen Dank für das Dropdown-Menü und deinen Hinweis!
Ich habe das Menü jetzt nach meinen Vorstellungen angepasst, und es funktioniert nahezu wunderbar.
Große Augen bekomme ich nämlich, wenn ich auf "Besucher" klicke. Das Menü klappt dann zwar wie gewünscht aus, aber das kuriose: Der Link (Vortrag), so wie dessen Unterseiten, werden in der gleichen Farbe dargestellt wie es für die Seiten "Partner" vorgesehen ist. (versteht man wohl besser, wenn man es sieht: http://p30744.typo3server.info/13.html)
Ich habe alles schon doppelt und dreifach durchgesehen und getestet, kann nur leider keinerlei Zusammenhang feststellen. Alle anderen Menüpunkte werden korrekt dargestellt. Wo kann hier wohl die Ursache liegen?
jens
Moin,
ich knüpfe hier dann mal an. Also mein Problem liegt eher darin das ich es nicht richtig ein gebunden bekomme, es passiert sozusagen nichts.
Also, ich möchte gerne dieses Menü in der Linken spalte als Navi benutzen.
http://www.just2b.com/mein-typo3/css-ts-menues/vertikales-dropdown-menue.html
An diesem Beispiel habe ich es versucht. Es steht da ja leider keine weitere Erklärung mit dabei.
So, habe in meiner HTML Datei als Marker ###MENU### sitzen.
Hab den TS Code in das Setup vom Template rein geschrieben. Schon am verschiedenen stellen probiert.
Dann habe ich die CSS daten in meine HTML mit <style type="text/css">...
rein geschrieben.
So wie auch das Javascript mit <script type="text/javascript"> in dei HTML, einmal hatte ich es im header und habe es nun noch runter gesetzt gehabt an diese Stelle, nix passierte.
Ich habe vermutlich einen einfachen Denkfehler. Aber deso länger man da sitzt und versucht, desto verwirrter ist man.
Hat für mich vielleicht jemand eine Anleitung welchen Code ich wo ein fügen muss und was ich ie verknüpfen muss? Danke.
Hallo ralfiklein,
wird denn der Marker überhaupt ersetzt?
georg
Ne wird er nicht.
Im Grunde habe ich ja nur kopiert was auf der Internetseite steht.
Mein Setup schaut zur zeit so aus, ich bin mir im unklaren ob das da überhaupt richtig sitzt.
page = PAGE
page {
typeNum = 0
10 = TEMPLATE
10 {
template = FILE
template.file = fileadmin/templates/designvorlage.tmpl
workOnSubpart = SCREEN
marks {
INHALT_LINKS = CONTENT
INHALT_LINKS {
table = tt_content
select {
where = colPos = 1
orderBy = sorting
languageField = sys_language_uid
}
}
INHALT_NORMAL = CONTENT
INHALT_NORMAL {
table = tt_content
select {
where = colPos = 0
orderBy = sorting
languageField = sys_language_uid
}
}
marks.MENU = HMENU
marks.MENU {
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
}
}
}
}
Ich verstehe es doch richtig das der eigentlich die Baumstruktur, bzw. das Sitemap aus liest oder?
da muss in Zeile 28+29 das marks weg... das hast du doppelt drinnen, denn in zeile 9 stehts ja auch schon
georg
Wunderbar, das hatte ich ganz übersehen.
Danke.
Mh, nun wunderts mich das ich da keinen Pfeil habe wenn ich eine unterseite abe, bzw. wunderts mich nicht weil ich ja die arrow.gif nicht habe.
Allerdings würde ich da auch das > rein setzen, nur zeigt er es mir nicht an.
Hallo,
ich habe ebenfalls probiert das Menü an meine Webseite anzupassen. Allerdings bekomme ich es nicht hin, dass es mit dem IE7 funktioniert. Auf der Seite (http://www.just2b.com/mein-typo3/css-ts-menues/horizontales-dropdown-menue.html) funktioniert es ja bestens auch mit dem IE7. Mit einem älteren Netscape 7.1 habe ich auch überhaupt keine Probleme. Weiß hier im Forum jemand Rat bzw. hatte mal das gleiche Problem? Prinzipiell scheint die Seite ja zu funktionieren. Es scheint als würde der Browser die JavaScript Funktionen nicht finden. Müssen die an einer bestimmten Stelle liegen?
Grüße aus dem Harz,
knut
Hallo ich habe das gleiche Problem,
habe ein reines css-menü und will
es auch im IE zum laufen bringen und zwar mit Javascript.
(ersetzen von :hover durch .iehover )
habe schon diverse Beispiele ausprobiert aber bei mir hat es den Anschein, das
Js nicht greift.
Steht bei mir im Head-Bereich der html-Vorlage
hier der script
<script type="text/javascript">
<!--//--><![CDATA[//><!--
ieHover = function() {
var LIs = document.getElementsByTagName("LI");
for (var i=0; i<LIs.lenght; i++){
LIs[i].onmouseover=function() {
this.className+=" iehover";
}
LIs[i].onmouseout=function() {
this.className=this.className.replace
(new RegExp(" iehover\\b"). "");
}
}
}
if (window.attachEvent) window.
attachEvent("onload".ieHover);
//--><!]]>
</script>
Hat jemand ne Idee, wie man testen kann, ob die Funktion angesprochen wird?
Danke