[TYPO3-german] DropDown Menü

Basti sebastian.schmal at gmx.de
Thu Nov 6 11:12:48 CET 2008


Hänge leider immer noch an dem Problem, könnte mir jemand sagen ob der 
typoscript code richtig ist?


ich möchte nur das der "tester" den mouseover hat, die seite davor oder 
die seiten danach sollen keinen haben!

NO.wrapItemAndSub = <li>|</li> || <li onmouseover="show(this)" 
onmouseout="hide(this)">|</li> |*| <li>|</li>


Vielen Dank, Basti




Basti schrieb:
> Hallo,
> 
> leider komm ich mit meinen DropDown-Menü nicht klar...
> 
> habe eine HTML Templatedatei erstellt:
> 
> im head:
> <script type="text/javascript">
>     //<![CDATA[
>         function show(element){
>             element.className += "hover";
>         }
>         function hide(element){
>             element.className = element.className = "";
>         }
>     //]]>
>     </script>
> 
> 
> 
> 
> im template:
> <!-- ANFANG NAVI -->
>             <div id="navi">
>                 <ul class="navigation">
>                     <li><a href="#">Startseite</a></li>
>                     <li onmouseover="show(this)" onmouseout="hide(this)" >
>                         <a href="#" class="active">tester</a>
>                         <ul onmouseover="show(this)" 
> onmouseout="hide(this)" >
>                           <li><a href="#">Ebene2 Punkt1</a></li>
>                           <li><a href="#">Ebene2 Punkt2</a></li>
>                           <li><a href="#">Ebene2 Punkt3</a></li>
>                         </ul>
>                     </li>
>                     <li><a href="#">Forum</a></li>
>                     <li><a href="#">Team</a></li>
>                     <li><a href="#">Partner</a></li>
>                     <li><a href="#">Impressum</a></li>
>                 </ul>
>             </div>
> 
> 
> navi css:
> #navi {
>     position:absolute;
>     margin: 0px;
>     margin-top: 94px;
>     margin-left: 100px;
>     padding: 0px;
>     height: 21px;
>     }
> 
> ul.navigation, ul.navigation ul {
>     list-style-type: none;
>     margin: 0px;
>     padding: 0px;
> }
> 
> ul.navigation a {
>     display: block;
>     margin: 0px 0px 0px 0px;
>     padding: 5px 12px 4px 12px;
>     font-family: Verdana;
>     font-size: 11px;
>     font-weight: bold;
>     color: #f0f0f0;
>     text-decoration: none;
>     border-left: 5px #3a3a45 solid;
> }
> 
> ul.navigation a:hover {
>     margin: 0px 0px 0px 0px;
>     padding: 5px 12px 4px 12px;
>     font-family: Verdana;
>     font-size: 11px;
>     font-weight: bold;
>     color: #6b6b74;
>     text-decoration: none;
>     }
> 
> ul.navigation a.active {
>     color: #6b6b74;
> }
> 
> ul.navigation ul a {
>     margin: 0px;
>     padding: 0px;
> }
> 
> ul.navigation li {
>     margin: 0px;
>     padding: 0px;
>     background-image: none;
>     float:left;
>     border: 0px;
> }
>     
> ul.navigation ul {
>     margin-left:0;
>     padding: 0 0 5px 0;
>     position: absolute;
>     background-color: #3a3a45;
>     border-left:1px solid #6b6b73;
>     border-right:1px solid #6b6b73;
>     border-bottom:1px solid #6b6b73;
>     display:none;
>     min-width: 150px;
> }
> 
> /* IE-Hack für die Breite */
> *html ul.navigation ul {
>     width: 150px;
> }
> 
> /* Dies sind die Klassenstile für das Untermenü wenn sich die Maus */
> /* über der Liste  befindet (.hover siehe JavaScript oben) */
> ul.navigation ul.hover, ul.navigation li.hover ul, ul.navigation 
> li:hover ul  {
>     display:block;
> }
> 
> ul.navigation ul li {
>     float:none;
>     background-color: transparent;
> }
> 
> ul.navigation ul li a {
>     margin: 0px 0px 0px 0px;
>     padding: 5px 0px 4px 3px;
>     font-family: Verdana;
>     font-size: 10px;
>     font-weight: normal;
>     color: #f0f0f0;
>     text-decoration: none;
> }
> 
> ul.navigation ul li a:hover {
>     margin: 0px 0px 0px 0px;
>     padding: 5px 0px 4px 3px;
>     font-family: Verdana;
>     font-size: 10px;
>     font-weight: normal;
>     color: #6b6b74;
>     text-decoration: none;
> }
> 
> 
> in meinen xhtml-Template funktioniert alles super!
> 
> doch bau ich das navi in mein typo3 ein, funktioniert es nicht...
> 
> navi typo3:
> # ---------------------
> # MainNavi
> # ---------------------
> 
> temp.menu = HMENU
> temp.menu {
>   ### Erste Ebene ###
>     1 = TMENU
>     1 {
>       wrap = <ul class="navigation">|</ul>
>       noBlur = 1
>       expAll = 1
>       #NO.wrapItemAndSub = <li onmouseover="show(this)" 
> onmouseout="hide(this)">|</li>
>       NO.wrapItemAndSub = <li>|</li> || <li onmouseover="show(this)" 
> onmouseout="hide(this)">|</li> |*| <li>|</li>
> 
>       ACT < .NO
>       ACT = 1
>       ACT.ATagParams = class="active"
>     }
> 
>     ### Zweite Ebene ###
>     2 = TMENU
>     2 {
>       noBlur = 1
>       wrap = <ul onmouseover="show(this)" onmouseout="hide(this)">|</ul>
>       NO.allWrap = <li>|</li>
>     }
> }
> 
> sobald ich über "tester" hover, und dann von dem hover runter gehe, 
> verschwindet der navibutton einfach aus dem navi!
> 
> Würde mich über Hilfe sehr freuen!
> 
> grüße, Basti

-- 
------------------------------------------

TYPO3 - TIPS - ANLEITUNGEN - NEWS - TYPO3

unter: http://blog.ingeniumdesign.de/

------------------------------------------


More information about the TYPO3-german mailing list