Snippets + Wiki

Dies ist eine alte Version des Dokuments!

Inhaltsverzeichnis

Brotkrumen-Navigation
Sprachauswahl
Verschachtelte Listen-Navigation

lib.breadcrumb = HMENU
lib.breadcrumb {
	special = rootline
	special.range = 0 | -1
	wrap = Sie sind hier: |
 
	1 = TMENU
	1.NO.allWrap = | > |*| | > |*| |
}

Sprachauswahl

lib.langMenu = COA
lib.langMenu {
  wrap = <ul>|</ul>
 
  10 = TEXT
  10 {
    value = Sprache:
    lang.en = Language:
    wrap = <li>|</li>
  }
 
  20 = HMENU
  20 {
    special = language
    special.value = 0,1
 
    addQueryString = 1
    addQueryString.exclude = id
    addQueryString.method = GET
 
    1 = TMENU
    1 {
      NO = 1
      NO {
        wrapItemAndSub = <li>|</li>
        stdWrap.cObject = TEXT
        stdWrap.cObject {
          value = Deutsch || Englisch
          lang.en = German || English
        }
      }
      ACT < .NO
      ACT {
        doNotLinkIt = 1
        wrapItemAndSub = <!!=:>|</li>
        stdWrap.cObject {
          value = Deutsch || Englisch
          lang.en = German || English
        }
      }
    }
  }
 
}

Aufgebaut mit unsortierten Listen (<ul>); die Anker (<a>) bilden mit display:block die Buttons. Die Menüpunkte werden durch Linien getrennt, welche auch bei Verschachtelung mehrerer Ebenen nur einmal vorhanden sind.

10 = HMENU
10 {
  1 = TMENU
  1 {
    wrap = <ul class="sub1">|</ul>
    noBlur = 1
 
    NO = 1
    NO {
    	ATagTitle.field = title
    	wrapItemAndSub = <li class="nav-first">|</li> || <li class="nav-norm">|</li>
    }
    CUR = 1
    CUR {
      ATagTitle.field = title
      wrapItemAndSub = <li class="nav-first-cur">|</li> || <li class="nav-cur">|</li>
    }
    ACT = 1
    ACT {
      ATagTitle.field = title
      wrapItemAndSub = <li class="nav-first-act">|</li> || <li class="nav-act">|</li>
    }
  }
  2 < .1
  2 {
    wrap = <li><ul class="sub2">|</ul></li>
  }
  3 < .1
  3 {
    wrap = <li><ul class="sub3">|</ul></li>
  }
}

#submenu {
  border-right: 1px solid #0055AA;
  float: left;
  font-size: 14px;
  line-height: 120%;
  min-height: 1px;
  width: 180px;
}
#submenu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  width: 180px;
}
#submenu a {
  display: block;
  padding: 8px 0 8px 5px;
  text-decoration: none;
}
 
/* Aufbau auf erster Ebene */
.nav-norm, .nav-cur, .nav-act {
  border-top: 1px solid #0055AA;
  margin: 0;
  padding: 0;
}
 
/* Aufbau auf zweiter Ebene */
.sub2 .nav-first, .sub2 .nav-first-cur, .sub2 .nav-first-act {
  border-top: 1px solid #0055AA;
  margin: 0;
  padding-left: 10px;
  width: 170px;
}
.sub2 li {
  margin-left: 10px;
  width: 170px;
}
 
/* Aufbau auf dritter Ebene (neue Breite je neuer Ebene) */
.sub3 li, .sub3 .nav-first, .sub3 .nav-first-cur, .sub3 .nav-first-act {
  width: 160px;
}
 
/* Anker nur erste Ebene */
.nav-first a, .nav-norm a {
  color: black;
  font-weight: bold;
}
.nav-first-cur a, .nav-cur a, .nav-first-act a, .nav-act a {
  background-color: #88BEFF;
  color: #0055AA;
  font-weight: bold;
}
.nav-first-cur a, .nav-cur a {
  background-color: #0055AA;
  color: white;
  font-weight: bold;
}
#submenu a:hover, #submenu a:active {
  background-color: #0055AA;
  color: white;
}
 
/* Anker ab zweiter Ebene (vererbt sich auf alle weiteren Ebenen) */
.sub2 a {
  font-weight: normal;
}
.sub2 .nav-first-cur a, .sub2 .nav-cur a, .sub2 .nav-first-act a, .sub2 .nav-act a {
  background-color: #88BEFF;
  color: #0055AA;
}
.sub2 .nav-first-cur a, .sub2 .nav-cur a {
  background-color: #0055AA;
  color: white;
  font-weight: bold;  
}

Snippets + Wiki

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Inhaltsverzeichnis

Brotkrumen-Navigation

Sprachauswahl

Verschachtelte Listen-Navigation

Seiten-Werkzeuge