[TYPO3-german] Mouseover H-Menu
Christian Wolff
chris at connye.com
Mon Nov 1 14:25:26 CET 2010
-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1
Am 01.11.2010 10:41, schrieb Hessix:
> Sers Christian,
>
> dein Verständnis ist genau richtig.
> Aber irgendwie verstehe ich deinen Vorschlag noch nicht ganz.
> Was meinst du mit einem ul Menu?
> Wie per css ausblenden? FÜr den Mouseover brauche ich ja alle Menus der
> 2. Ebene wieder...
>
> Gruß Lars
>
Hi Lars,
du generierst ein html das ungeführ so aussieht:
HTML:
<ul id="menu">
<li>Ebene1 A
<ul>
<li>Ebene2 A A</li>
<li>Ebene2 A B</li>
<li>Ebene2 A C</li>
</ul>
</li>
<li class="act">Ebene1 B
<ul>
<li>Ebene2 A A</li>
<li>Ebene2 A B</li>
<li>Ebene2 A C</li>
</ul>
</li>
<li>Ebene1 C
<ul>
<li>Ebene2 A A</li>
<li>Ebene2 A B</li>
<li>Ebene2 A C</li>
</ul>
</li>
</ul>
CSS:
/* koordinaten system setzten*/
ul#menu {position:relative}
/* Submenüs stylen (ausgeblendet)*/
ul#menu ul {
position:absolute;
top:30px;
left:0px;
width:900px;
height:30px;
Z-index:10;
background:#fff;
display:none;
}
/* Actives menü einblenden*/
ul#menu li.act ul {
display:block;
}
/* im Hover Status einblenden */
ul#menu li:hover ul {
display:block;
z-index:20; /* z-index setzten damit das
menü auf jedenfall dem act menü gezeigt wird.*/
}
html und css ist jetzt einfach mal so in die mail getippt kann also
tippfehler enthalten. ältere IE's unterstützen den :hover status nur auf
links da muss man mit javascript nachhelfen.
gruss chris
- --
Christian Wolff // Berlin
http://www.connye.com
some projects:
http://richtermediagroup.com | http://titanic.de | http://keyopinions.info
-----BEGIN PGP SIGNATURE-----
Version: GnuPG v1.4.10 (MingW32)
iEYEARECAAYFAkzOv8YACgkQIcCaXPh/JHESQgCg2dXJdTXqjSKAa/raWqwrkjke
aSYAnjojQalwBeZFCmcq/o2y8iO2s2cP
=lnZQ
-----END PGP SIGNATURE-----
More information about the TYPO3-german
mailing list