Hallo liebe Gemeinschaft.
ich bin dabei eine Dropline-Navi zu entablieren und möchte, dass sich die erste Ebene so verhält als wäre es ein Link auf die Unterseite aber beim Klicken auf den Link das Ziel ins lehre läuft. z. B. wenn man in html <a href="#"> eingibt.
Der Grund ist der, dass die Navi das Dropline onClick ausfährt. Ist doof, wenn dann sofort die andere Seite erscheint.
10.marks{
NAVI = HMENU
NAVI {
special = directory
special.value = 167
entryLevel = 1
### Erste Ebene ###
1 = TMENU
1 {
wrap = <ul id=\"dropline\">|</ul>
expAll = 1
noBlur = 1
NO.wrapItemAndSub = <li tabindex=\"1\">|</li>
}
Hallo Ralf112,
NO.doNotLinkIt = 1
Das verhindert, das Menupunkte verlinkt werden.
Einfach in der Ebene 2 angeben.
(Wie der Name schon sagt)
gruß
jazbo
Ohne mich einmischen zu wollen, aber ich denke du solltst das in der ersten Ebene mit eintragen :-)
1 = TMENU
1 {
doNotLinkIt = 1
wrap = <ul id=\"dropline\">|</ul>
expAll = 1
noBlur = 1
NO.wrapItemAndSub = <li tabindex=\"1\">|</li>
}
Im übrigen kannst du mit
1.NO.ATagParams = onclick="jsTuWas()"
auch die onclick-Funkton o.ä. festleen, falls
das nötig sein sollte.
Ich empfehle dir aber aus Gründen der Barrierefreiheit
eine Fallback-Lösung parat zu halten für Menschen ohne Javascript
( ja, sowas gibts auch noch )
Hallo Chrissli und jazbo,
erst mal vielen Dank für eure schnelle Antworten.
Das Problem mit dem doNotLinkIt =1 ist, dass es den a-tag komplett entfernt. Ich bin in meinem CSS aber darauf angewiesen, sonst klappt der meine zweite Ebene nicht mehr aus.
Ich hänge mal das CSS an:
html {-webkit-animation: safariSelectorFix infinite 1s;}
@-webkit-keyframes safariSelectorFix {
0% {zoom:1;}
100% {zoom:1;}
}
body, #dropline a,
html {behavior:url(click-dropline/trigger.htc)}
#dropline {height:35px; position:relative; text-align:center; width:850px; margin:0 auto; z-index:100; font-family:arial, sans-serif; font-size:12px; position:relative; background:#069;
-ms-border-radius: 35px 25px 0 0;
-moz-border-radius: 35px 35px 0 0;
border-radius: 35px 35px 0 0;
-webkit-box-reflect: below 0px -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.5)), to(transparent));
}
#dropline, #dropline ul {padding:0; margin:0; list-style:none;}
#dropline li {display:inline;}
#dropline li a {display:inline-block; line-height:35px; padding:0 20px; background:#069; color:#fff; text-decoration:none; font-weight:bold;
-ms-border-radius: 35px 35px 0 0;
-moz-border-radius: 35px 35px 0 0;
border-radius: 35px 35px 0 0;
}
#dropline ul {position:absolute; left:-9999px; width:850px; top:35px; text-align:center; height:35px; background:#69c; display:inline-block;
-ms-border-radius: 0 0 35px 35px;
-moz-border-radius: 0 0 35px 35px;
border-radius: 0 0 35px 35px;
-webkit-box-reflect: below 0px -webkit-gradient(linear, left bottom, left top, from(rgba(255,255,255,0.5)), to(transparent));
}
#dropline ul li a {background:#69c;
-ms-border-radius: 35px 35px 0 0;
-moz-border-radius: 35px 35px 0 0;
border-radius: 35px 35px 0 0;
}
#dropline ul li a:hover {background:#7ad;}
#dropline li a:active {outline:none; background:#69c;}
#dropline li a:active + ul {left:0; border:0;}
#dropline a:focus {outline:0; background:#69c;}
#dropline a:focus + ul {left:0;}
#dropline ul:hover {left:0;}vHolder {position:relative; width:850px; height:50px; overflow:hidden; background:url(images/back.gif); background-repeat: repeat-x; z-index:100; backgroundcolor: #fff;}
Mit klick auf den link wird das Untermenu ausgeklappt. Vieleicht gibt es hierfür ja auch eine CSS-Lösung.
Nochmals vielen Dank für eure Hilfe