Eine PopUp Navigation erstellen

Eine Popup-Navigation wie diese häufig im Internet verwendet wird kann mit dem CONTEX Autonavigations-PlugIn einfach erstellt werden.

Das Popup-Menü kann auch noch weitere Submenüpunkte haben, welches auf der Abbildung nicht ersichtlich sind. Sie können die unten Dargestellte XML Definition auch erweitern, wenn Sie noch mehr Submenüs benötigen.

XML Definition für Navigation

Folgende XML Definition muss in der Inhaltsvorlage der entsprechenden NavSection definiert werden:

<!--NAVLEVEL0 HEAD--><!--RepeatLastSiblingSeparator--><div id="pop_nav"><ul id="nav"><!--/NAVLEVEL0 HEAD--> <!--NAVLEVEL0 CONTENT--><!--NAVLEVEL0 IF CURRENT=TRUE --><li class="current"><!--NAV0DESC--><!--NAVLEVEL1 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL1 HEAD--> <!--NAVLEVEL1 CONTENT--><!--NAVLEVEL1 IF CURRENT=TRUE --><li class="current"><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 CONTENT--><!--NAVLEVEL1 IF OPEN=TRUE --><li class="open"><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 CONTENT--><li><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 FOOTER--></ul><!--/NAVLEVEL1 FOOTER--></li> <!--/NAVLEVEL0 CONTENT--> <!--NAVLEVEL0 CONTENT--><!--NAVLEVEL0 IF OPEN=TRUE --><li class="open"><!--NAV0DESC--><!--NAVLEVEL1 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL1 HEAD--> <!--NAVLEVEL1 CONTENT--><!--NAVLEVEL1 IF CURRENT=TRUE --><li class="current"><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 CONTENT--><!--NAVLEVEL1 IF OPEN=TRUE --><li class="open"><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 CONTENT--><li><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 FOOTER--></ul><!--/NAVLEVEL1 FOOTER--></li> <!--/NAVLEVEL0 CONTENT--> <!--NAVLEVEL0 CONTENT--><li><!--NAV0DESC--><!--NAVLEVEL1 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL1 HEAD--> <!--NAVLEVEL1 CONTENT--><!--NAVLEVEL1 IF CURRENT=TRUE --><li class="current"><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 CONTENT--><!--NAVLEVEL1 IF OPEN=TRUE --><li class="open"><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 CONTENT--><li><!--NAV1DESC--><!--NAVLEVEL2 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL2 HEAD--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF CURRENT=TRUE --><li class="current"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--><ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><!--NAVLEVEL2 IF OPEN=TRUE --><li class="open"><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 CONTENT--><li><!--NAV2DESC--><!--NAVLEVEL3 HEAD--><!--RepeatLastSiblingSeparator--> <ul><!--/NAVLEVEL3 HEAD--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF CURRENT=TRUE --><li class="current"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><!--NAVLEVEL3 IF OPEN=TRUE --><li class="open"><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 CONTENT--><li><!--NAV3DESC--></li> <!--/NAVLEVEL3 CONTENT--> <!--NAVLEVEL3 FOOTER--></ul><!--/NAVLEVEL3 FOOTER--></li> <!--/NAVLEVEL2 CONTENT--> <!--NAVLEVEL2 FOOTER--></ul><!--/NAVLEVEL2 FOOTER--></li> <!--/NAVLEVEL1 CONTENT--> <!--NAVLEVEL1 FOOTER--></ul><!--/NAVLEVEL1 FOOTER--></li> <!--/NAVLEVEL0 CONTENT--> <!--NAVLEVEL0 FOOTER--></ul></div><!--/NAVLEVEL0 FOOTER-->

Hinweis: Die von uns angebotene Navigation basiert auf der Ursprünglichen Idee, dass Navigationen Listen sind und man diese Listen mit Hilfe von CSS so gestaltet wie man sie möchte. Das Definitions-XML stellt so eine Liste bereit die Ihre Listenpunkte entsprechend dem aktuellen zustand mit den Klassenbezeichnungen "current" oder "open" versieht. Mit dem nötigen Wissen über CSS können Sie diese XML Definition für fast jede gewünschte Anwendung verwenden. Die Definition unterstützt bis zu 4 Navigationsstufen. Bitte beachten Sie, dass das Container DIV "pop_nav" bereits in der Definition integriert ist.

CSS Definition

Für die im Screenshot gezeigte Darstellung können Sie folgende Stylesheet-Daten verwenden:

/* Navigation */ #pop_nav { position: relative; } #pop_nav li a{ display: block; } #pop_nav li a:hover{ text-decoration: none; color: #000; } #pop_nav ul{ list-style: none; margin: 0px; padding: 0px; } #pop_nav ul li{ list-style: none; border: 1px #afafaf solid; position: relative; margin-top: 1px; width: 132px; } #pop_nav ul li:hover, #pop_nav ul li.over{ background: #cfcfcf; } #pop_nav ul li ul { display: none; position: absolute; left: 100%; top: 0px; z-index: 2; padding: 3px; } #pop_nav ul li ul { border: 1px #afafaf solid; background: #f3f3f3; } #pop_nav ul li ul li{ } #pop_nav ul li:hover ul, #pop_nav ul li.over ul{ display: block; z-index: 2; } #pop_nav ul li:hover ul li ul, #pop_nav ul li.over ul li ul{ display: none; z-index: 3; } #pop_nav ul li ul li:hover ul, #pop_nav ul li ul li.over ul{ display: block; z-index: 3; } #pop_nav ul li ul li:hover ul li ul, #pop_nav ul li ul li.over ul li ul{ display: none; z-index: 4; } #pop_nav ul li ul li ul li:hover ul, #pop_nav ul li ul li ul li.over ul{ display: block; z-index: 4; } /*/Navigation */

IE < 7.0 Bugfix

Obwohl wir dringend empfehlen nur noch für Browser zu entwickeln, welche CSS2 den W3C Definitionen entsprechend interpretieren haben wir für ein essentielles Element wie die Navigation ein Workaround kreiert, dass eine vertretbare Darstellung ermöglicht.

Damit die Navigation auch mit veralteten Versionen von Internet Explorer funktioniert müssen sie den unten stehenden Code in Ihre Javascript Definitionen Kopieren (inkl. der nach Kommentierungen aussehenden Einklammerungen). Das Skript versieht Listenpunkte über denen sich gerade die Maus befindet mit der Klassenbezeichnung "over". Entsprechende Anpassungen in oben stehender CSS-Definition sind bereits vorgenommen.

<!--[if lt IE 7]> sfHover = function() { var sfEls = document.getElementById("nav").getElementsByTagName("li"); for (var i=0; i<sfEls.length; i++) { sfEls[i].onmouseover=function() { this.className+=" over"; } sfEls[i].onmouseout=function() { this.className=this.className.replace(new RegExp(" over\\b"), ""); } } } if (window.attachEvent) window.attachEvent("onload", sfHover); <![endif]-->