Differences

This shows you the differences between two versions of the page.

deutsch:navigationen:dropdown_flyout:nav_horiz_dd [2010/02/10 16:46]
Knut Heermann (flip-flop)
deutsch:navigationen:dropdown_flyout:nav_horiz_dd [2018/06/03 18:09] (current)
Line 17: Line 17:
**CMS-Version:** >= V1.2.8  \\ **CMS-Version:** >= V1.2.8  \\
**Version:** V1.0  //28.04.08// \\ **Version:** V1.0  //28.04.08// \\
 +**Update Version:** V1.01 //04.09.2010// \\
 +- Der Link "Home" kann wahlweise dargestellt werden (Im PHP-Script ein/ausschalten). \\
Line 26: Line 28:
  * Überlappen und Überfahr(rahm)en !!!   * Überlappen und Überfahr(rahm)en !!!
  * Start-ID im RT   * Start-ID im RT
-  * Max Leveltiefe im RT (seit 28.04.08)+  * Max Leveltiefe im RT //(seit 28.04.08)//
  * Aktiver Pfad wird für die erste Ebene gekennzeichnet   * Aktiver Pfad wird für die erste Ebene gekennzeichnet
-  * Jedes li hat eine eigene Klasse (optional)+  * Jedes li hat eine eigene Klasse //(optional)// 
 +  * Home kann dargestellt werden //(optional in V1.01 seit 04.09.10)//
  * Einfache html Tags in der Kategorieüberschrift wie [i] [b] [u] [s]   * Einfache html Tags in der Kategorieüberschrift wie [i] [b] [u] [s]
Line 76: Line 79:
--- Ebene05 --- Ebene05
</code> </code>
 +**V1.0:**
  * Es wird im Artikel von **root** nach **home** weitergeleitet //(permanent 301)//. \\   * Es wird im Artikel von **root** nach **home** weitergeleitet //(permanent 301)//. \\
-    * Weiterleitung [index.php?home]+    * Weiterleitung [index.php?home] \\ 
 + 
 +**V1.01:** 
 +  * Weiterleitung von **root** nach **home** nicht notwendig, im Script kann der Link ein/ausgeschaltet werden (//in %%==== Custom var ====%%)// \\ Generierter code: ##%%<li id="cat-id_0" class="drop home"><a class="first" href="....%%## \\
---- ----
Line 83: Line 90:
\\ \\
-==== PHP ====+==== PHP V1.0 ====
Dateiname: **rt_nav_horiz_drop_down.php** Dateiname: **rt_nav_horiz_drop_down.php**
Line 127: Line 134:
   if($counter == 0) {    if($counter == 0) {
      $last = count($struct) - 1;       $last = count($struct) - 1;
 +    
   } else {    } else {
      $last = 0;       $last = 0;
Line 252: Line 260:
?> ?>
</code> </code>
 +\\
 +
 +==== PHP V1.01 ====
 +Dateiname: **rt_nav_horiz_drop_down.php**
 +
 +Ort:  **/template/inc_script/frontend_render/ **
 +
 +
 +<code php|h rt_nav_horiz_drop_down.php |h>
 +<?php
 +// **************************************************************************
 +// Version 1.01 04.09.2010 KH
 +// 25.07.07 horizontal drop-down with ID output -> NAVI HORIZONTAL DROP-DOWN
 +// Oliver Georgi
 +// http://www.phpwcms.de/forum/viewtopic.php?p=89743#89743
 +// 08.11.07 KH (flip-flop) Enhanced: Start[ID] {NAV_HORIZ_DD:ID}
 +// 28.04.08 KH (flip-flop) Enhanced: Level depth {NAV_HORIZ_DD:ID,Depth}
 +// 04.09.10 KH (flip-flop) Enhanced: Home link (enable/disable around line 36)
 +// http://www.phpwcms.de/forum/viewtopic.php?p=94688#94688
 +//
 +// TAG:      {NAV_HORIZ_DD:ID,Level depth}
 +// Location: Put it into the file e.g.:
 +//           /template/inc_script/frontend_render/rt_nav_horiz_drop_down.php
 +// Switch in conf.inc.php: $phpwcms['allow_ext_render']  = 1;
 +// **************************************************************************
 +
 +// ----------------------------------------------------------------
 +// obligate check for phpwcms constants
 +if (!defined('PHPWCMS_ROOT')) {
 +   die("You Cannot Access This Script Directly, Have a Nice Day.");
 +}
 +// ----------------------------------------------------------------
 +
 +if( ! ( strpos($content["all"],'{NAV_HORIZ_DD')==false ) ) {
 +  $content["all"] = str_replace('{NAV_HORIZ_DD}','{NAV_HORIZ_DD:0,100}',$content["all"]);
 +  $content["all"] = preg_replace('/\{NAV_HORIZ_DD:(.*?)\}/i','{NAV_HORIZ_DD:$1,100}', $content["all"]);
 +  $content["all"] = preg_replace('/\{NAV_HORIZ_DD:(.*?),(.*?)\}/e','buildNavi_horiz("$1","0","$2"-1);', $content["all"]);
 +}
 +//   $content['all'] = str_replace('{NAVI}', buildNavi(), $content['all']);
 +
 +function buildNavi_horiz($start=0, $counter=0, $depth=0) {
 +  
 +// ============ Custom var ===========
 +  
 +   $home_link = false;   // [true|false] = [enabled|disabled]
 +  
 +// ============ END Custom var =======
 +
 +
 +   $t = array();
 + 
 +   $struct = getStructureChildData($start);  // Catch structure
 + 
 +   if($counter == 0) {
 +      $last = count($struct) - 1;
 +
 +    // ======== Only if you want home // Nur wenn Home gewuenscht
 +      if ($home_link) {
 +          $l  = '<li id="cat-id_0" class="drop home">';
 +          $l .= get_level_ahref(0, ' class="first"') . '<span>'. html_specialchars($GLOBALS['content']['struct'][0]['acat_name']);
 +          $l .= '</span></a></li>';
 +          $t[] = $l;
 +      }
 +    // ======= END Home
 +      
 +   } else {
 +      $last = 0;
 +   }
 +  
 +   $x = 0;
 +  
 +   foreach($struct as $value) {
 +  
 +// Is it a active path ?      ========
 +// Ist dies der aktive Pfad ? ========
 +      if( isset($GLOBALS['LEVEL_KEY'][ $value['acat_id'] ]) ) {
 +    
 +         $p1 = ' act_path';
 +      } else {
 +         $s  = '';           // Reset $struct
 +         $p1 = '';
 +      }
 +  
 +// Only if there is a sub level     ========
 +// Nur wenn SubLevel vorhanden ist  ========
 +      if($GLOBALS['content']['cat_id'] == $value['acat_id']) {
 +         $a1 = ' act_path';  // Only for a direct call // Nur bei direktem Aufruf (FirstLevel active)
 +         $a3 = '';           // Not in use
 +      } else {               // If first level isn´t active // Wenn FirstLevel nicht aktiv
 +         $a1 = $p1;
 +         $a3 = '';
 +      }
 +// ==========================
 +
 +      // -- <D01> -------------------------------------------------------------------
 +      // Preset level depth added
 +      // Ebenetiefenvorgabe hinzugefuegt
 +      //      $s = buildNavi_horiz($value['acat_id'], $counter+1);
 +      if (($counter) < $depth) {$s = buildNavi_horiz($value['acat_id'], $counter+1, $depth);
 +      }
 +      else {$s = '';}
 +      // -- <D01> -------------------------------------------------------------------
 +      if($s) {
 +         $g  = '<!--[if gte IE 7]><!--></a><!--<![endif]-->';
 +         $g .= $s;
 +         $g .= LF . str_repeat('   ', $counter);
 +        
 +//         $class = $counter ? (' class="fly_ul '.$a1.'"') : (' class="drop_ul '.$a1.'"'); // Second level with active category
 +         $class = $counter ? (' class="fly_ul"') : (' class="drop_ul '.$a1.'"');
 +        
 +         $close_li = str_repeat('   ', $counter+1);
 +        
 +      } else {
 +         $g  = '</a>';
 +         $class = ' class="sub_no"';            // If you don´t use the sub_no please change to: $class = '';
 +        // -- <P01> -------------------------------------------------------------------
 +         // Only the first level if there is no sub level
 +         // Ausschlieszlich das erste Level wenn kein Sublevel vorhanden ist
 +         if ($counter == 0) {
 +            $class = ' class="sub_no'.$a1.'"';  // Set it, it is active or not // Es ist aktiv oder nicht
 +         // -- <P01> -------------------------------------------------------------------
 +         }
 +         $close_li = '';
 +      }
 +    
 +//    first li in block          =======
 +//    Erstes li im letzten Block =======
 +      if( $last && $last == $x ) {
 +         $enclose = ' class="horiz_enclose"';
 +      } elseif( $x || ($counter == 0 && $x == 0) ) {
 +         $enclose = '';
 +      } else {
 +         $enclose = ' class="horiz_enclose"';
 +      }
 +
 +//    IDs for every li  ======= If you need the ID class, please uncomment/comment
 +//    IDs fuer jedes li ======= Wenn sie die ID Klassen benoetigen, bitte dekommentieren/kommentieren
 +//      $l  = str_repeat('   ', $counter+1) . '<li'. $class . ' id="cat-id_' . $value['acat_id'] . '">';
 +      $l  = str_repeat('   ', $counter+1) . '<li'. $class . '>';
 +
 +      $l .= get_level_ahref($value['acat_id'], $enclose) . html_specialchars($value['acat_name']);
 +      $l .= $g;
 +    
 +    
 +      $l .=  $close_li . '</li>';
 +    
 +      $t[] = $l;
 +
 +      $x++;
 +   }
 +  
 +   if($counter) {
 +      $A = LF . str_repeat('   ', $counter) . '<!--[if lte IE 6]><table><tr><td><![endif]-->';
 +      $B = LF . str_repeat('   ', $counter) . '<!--[if lte IE 6]></td></tr></table></a><![endif]-->';
 +   } else {
 +      $A = '';
 +      $B = '';
 +   }
 +  
 +  
 +   $t = implode(LF, $t);
 +   if($t) {
 +      $t =   $A . LF . str_repeat('   ', $counter) .   '<ul'.($counter?'':' id="pmenu"').'>' . LF . $t . LF . str_repeat('   ', $counter) . '</ul>'.   $B ;
 +   }
 +
 +/*
 +   // -- <E01> -------------------------------------------------------------------
 +   // EDIT: 07/11/25 KH. (flip-flop) including simple Tags in category headline from the file
 +   //  /include/inc_front/front.func.inc.php  and the  function html_parser($string)
 +   // you can copy&paste what you want.
 +
 +   // ========== copy&paste ===========
 +
 +   // typical html formattings
 +   $search[18]      = '/\[i\](.*?)\[\/i\]/is';         $replace[18]   = '<i>$1</i>';
 +   $search[19]      = '/\[u\](.*?)\[\/u\]/is';         $replace[19]   = '<u>$1</u>';
 +   $search[20]      = '/\[s\](.*?)\[\/s\]/is';         $replace[20]   = '<strike>$1</strike>';
 +   $search[21]      = '/\[b\](.*?)\[\/b\]/is';         $replace[21]   = '<strong>$1</strong>';
 +
 +   // ========== end copy&paste ========
 +  
 +   $t = preg_replace($search, $replace, $t);
 +
 +   // -- <E01> -------------------------------------------------------------------
 +*/
 +  
 +   return $t;
 +}
 +?>
 +</code>
 +
 +\\
==== CSS  ==== ==== CSS  ====
Line 259: Line 459:
<code php|h /nav_horiz_drop_down.css |h> <code php|h /nav_horiz_drop_down.css |h>
-    /* ================================================================ +/* ================================================================ 
-    This copyright notice must be untouched at all times.+This copyright notice must be untouched at all times.
-    The original version of this stylesheet and the associated (x)htmlis +The original version of this stylesheet and the associated (x)htmlis 
-    available at http://www.cssplay.co.uk/menus/simple_vertical.html +available at http://www.cssplay.co.uk/menus/simple_vertical.html 
-    Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. +Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. 
-    This stylesheet and the associated (x)html may be modified in any +This stylesheet and the associated (x)html may be modified in any 
-    way to fit your requirements.+way to fit your requirements.
-    08.11.07 KH (flip-flop) Enhanced: Start[ID] {NAV_HORIZ_DD:ID} +08.11.07 KH (flip-flop) Enhanced: Start[ID] {NAV_HORIZ_DD:ID} 
-    http://www.phpwcms.de/forum/viewtopic.php?p=94688#94688 +http://www.phpwcms.de/forum/viewtopic.php?p=94688#94688 
-    (http://www.phpwcms.de/forum/viewtopic.php?p=89743#89743) +(http://www.phpwcms.de/forum/viewtopic.php?p=89743#89743) 
-    =================================================================== */ +=================================================================== */ 
-    /* Add a margin - for this demo only - and a relative position with a high z-index to make it appear over any element below */ +/* Add a margin - for this demo only - and a relative position with a high z-index to make it appear over any element below */ 
-    /* margin hinzugefuegt - ausschließlich fuer diese demo - und ein "relative position" mit einem hohen z-index Wert um sicherzustellen dass das Menue ueber jedem nachfolgenden Element aufklappt. */+/* margin hinzugefuegt - ausschließlich fuer diese demo - und ein "relative position" mit einem hohen z-index Wert um sicherzustellen dass das Menue ueber jedem nachfolgenden Element aufklappt. */
-    #menu_container { +#menu_container { 
-       margin: 0 0 100px 0;  /* 100px only for testing - default = 0 */ +   margin: 0 0 100px 0;  /* 100px only for testing - default = 0 */ 
-       position: relative; +   position: relative; 
-       width: 735px; +   width: 735px; 
-       height: 21px;      /* ORG 20px */ +   height: 21px;      /* ORG 20px */ 
-       z-index: 1000; +   z-index: 1000; 
-    +
-    /* Get rid of the margin, padding and bullets in the unordered lists */ +/* Get rid of the margin, padding and bullets in the unordered lists */ 
-    /* margin und padding auf 0, Aufzählungszeichen der unsortierten Liste unterdruecken */ +/* margin und padding auf 0, Aufzählungszeichen der unsortierten Liste unterdruecken */ 
-    #pmenu, #pmenu ul { +#pmenu, #pmenu ul { 
-       padding: 0; +   padding: 0; 
-       margin: 0; +   margin: 0; 
-       list-style-type: none; +   list-style-type: none; 
-    +
-    /* Set up the link size, color and borders */ +/* Set up the link size, color and borders */ 
-    /* Einstellen der Groeszen, Farben und Rahmen fuer die Links */ +/* Einstellen der Groeszen, Farben und Rahmen fuer die Links */ 
-    #pmenu a, #pmenu a:visited { +#pmenu a, #pmenu a:visited { 
-       display: block; +   display: block; 
-       width: 120px; +   width: 120px; 
-       font-size: 11px; +   font-size: 11px; 
-       color: #fff; +   color: #fff; 
-       height: 21px;      /* ORG 25px */ +   height: 21px;      /* ORG 25px */ 
-       line-height: 20px; /* ORG 24px */ +   line-height: 20px; /* ORG 24px */ 
-       text-decoration: none; +   text-decoration: none; 
-       text-indent: 5px; +   text-indent: 5px; 
-       border: 1px solid #fff; +   border: 1px solid #fff; 
-       border-width: 1px 0 1px 1px; +   border-width: 1px 0 1px 1px; 
-    +
-    /* Set up the sub level borders */ +/* Set up the sub level borders */ 
-    /* Einstellen der Rahmen fuer die Unterebenen  */ +/* Einstellen der Rahmen fuer die Unterebenen  */ 
-    #pmenu li ul li a, #pmenu li ul li a:visited { +#pmenu li ul li a, #pmenu li ul li a:visited { 
-       border-width: 0 1px 1px 1px; +   border-width: 0 1px 1px 1px; 
-    +
-    #pmenu li a.horiz_enclose, #pmenu li a.horiz_enclose:visited { +#pmenu li a.horiz_enclose, #pmenu li a.horiz_enclose:visited { 
-       border-width: 1px; +   border-width: 1px; 
-    +
-    /* Set up the list items */ +/* Set up the list items */ 
-    /* Einstellen der Listeneinzelheiten */ +/* Einstellen der Listeneinzelheiten */ 
-    #pmenu li { +#pmenu li { 
-       float: left; +   float: left; 
-            list-style-type: none; +        list-style-type: none; 
-       background: #7484ad; +   background: #7484ad; 
-    +
-    /* For Non-IE browsers and IE7 */ +/* For Non-IE browsers and IE7 */ 
-    /* Fuer alle nicht IE + IE7 */ +/* Fuer alle nicht IE + IE7 */ 
-    #pmenu li:hover { +#pmenu li:hover { 
-       position: relative; +   position: relative; 
-    +
-    /* Make the hovered list color persist */ +/* Make the hovered list color persist */ 
-    /* Festlegen der Farbe fuer hover li */ +/* Festlegen der Farbe fuer hover li */ 
-    #pmenu li:hover > a { +#pmenu li:hover > a { 
-       background: #D1D5DF; /* ORG #dfd7ca; */ +   background: #D1D5DF; /* ORG #dfd7ca; */ 
-       color: #BF4300;      /* ORG #c00; */ +   color: #BF4300;      /* ORG #c00; */ 
-    +
-    /* Set up the sublevel lists with a position absolute for flyouts and overrun padding. The transparent gif (leer.gif) is for IE to work */ +/* Set up the sublevel lists with a position absolute for flyouts and overrun padding. The transparent gif (leer.gif) is for IE to work */ 
-    /* Einstellen der Unterebenenlisten mit einer absoluten Positionierung fuer die FlyOuts und dem "Ueberfahren-Abstand" +/* Einstellen der Unterebenenlisten mit einer absoluten Positionierung fuer die FlyOuts und dem "Ueberfahren-Abstand" 
-       Das transparente gif (leer.gif) ist fuer den IE gedacht */ +   Das transparente gif (leer.gif) ist fuer den IE gedacht */ 
-    #pmenu li ul { +#pmenu li ul { 
-       display: none; +   display: none; 
-    +
-    /* For Non-IE and IE7 make the sublevels visible on list hover. This is all it needs */ +/* For Non-IE and IE7 make the sublevels visible on list hover. This is all it needs */ 
-    /* Fuer alle nicht-IE + IE7 wird die Unterebenenliste sichtbar bei einem Ueberfahren (hover) */ +/* Fuer alle nicht-IE + IE7 wird die Unterebenenliste sichtbar bei einem Ueberfahren (hover) */ 
-    #pmenu li:hover > ul { +#pmenu li:hover > ul { 
-       display: block; +   display: block; 
-       position: absolute; +   position: absolute; 
-       top: -7px;         /* ORG -11px */ +   top: -7px;         /* ORG -11px */ 
-       left: 80px; +   left: 80px; 
-       padding: 6px 30px 30px 30px; /* ORG padding: 10px */ +   padding: 6px 30px 30px 30px; /* ORG padding: 10px */ 
-       background:transparent url(../../img/article/leer.gif); +   background:transparent url(../../img/article/leer.gif); 
-       width: 120px; +   width: 120px; 
-    +
-    /* Position the first sub level beneath the top level links */ +/* Position the first sub level beneath the top level links */ 
-    /* Positioniere die erste Unterebene nach dem Topebenenlink */ +/* Positioniere die erste Unterebene nach dem Topebenenlink */ 
-    #pmenu > li:hover > ul { +#pmenu > li:hover > ul { 
-       left: -30px; +   left: -30px; 
-       top: 16px; +   top: 16px; 
-    +
-    /* get rid of the table */ +/* get rid of the table */ 
-    /* Tabelle neu einstellen */ +/* Tabelle neu einstellen */ 
-    #pmenu table { +#pmenu table { 
-       position: absolute; +   position: absolute; 
-       border-collapse: collapse; +   border-collapse: collapse; 
-       top: 0; +   top: 0; 
-       left: 0; +   left: 0; 
-       z-index: 1000; +   z-index: 1000; 
-       font-size: 1em; +   font-size: 1em; 
-    +
-    /* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */ +/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */ 
-    /* Fuer den IE5 und IE6 gebe dem hover-Link eine relative Position und wechsele die Hinter- und Vordergrundfarbe. Das ist notwendig damit der IE angestoszen wird die Unterebenen auszugeben */ +/* Fuer den IE5 und IE6 gebe dem hover-Link eine relative Position und wechsele die Hinter- und Vordergrundfarbe. Das ist notwendig damit der IE angestoszen wird die Unterebenen auszugeben */ 
-    * html #pmenu li a:hover { +* html #pmenu li a:hover { 
-       position: relative; +   position: relative; 
-       background: #D1D5DF; /* ORG #dfd7ca; */ +   background: #D1D5DF; /* ORG #dfd7ca; */ 
-       color: #c00; +   color: #c00; 
-    +
-    /* For accessibility of the top level menu when tabbing */ +/* For accessibility of the top level menu when tabbing */ 
-    /* Fuer die Aktivierung der ersten Ebene, wenn im Menue geblättert wird */ +/* Fuer die Aktivierung der ersten Ebene, wenn im Menue geblättert wird */ 
-    #pmenu li a:active, #pmenu li a:focus { +#pmenu li a:active, #pmenu li a:focus { 
-       background: #dfd7ca; +   background: #dfd7ca; 
-       color: #BF4300;      /* ORG #c00; */ +   color: #BF4300;      /* ORG #c00; */ 
-    +
-    /* Set up the pointers for the sub level indication */ +/* Set up the pointers for the sub level indication */ 
-    /* Einstellen der Symbole/Pfeile für die Unterebenenanzeige */ +/* Einstellen der Symbole/Pfeile für die Unterebenenanzeige */ 
-    #pmenu li.fly_ul { +#pmenu li.fly_ul { 
-       background: #7484ad url(../../img/symbols/klapp_zu.gif) no-repeat 107px center; +   background: #7484ad url(../../img/symbols/klapp_zu.gif) no-repeat 107px center; 
-    /*   background: #7484ad url(../../img/article/navi/fly.gif) no-repeat right center; +/*   background: #7484ad url(../../img/article/navi/fly.gif) no-repeat right center; 
-    */ +*/ 
-    }+}
-    #pmenu li.drop_ul { +#pmenu li.drop_ul { 
-       background: #7484ad url(../../img/symbols/klapp_auf.gif) no-repeat 105px center; +   background: #7484ad url(../../img/symbols/klapp_auf.gif) no-repeat 105px center; 
-       /* background: #7484ad url(../../img/article/navi/drop.gif) no-repeat right center; +   /* background: #7484ad url(../../img/article/navi/drop.gif) no-repeat right center; 
-    */ +*/ 
-    +
-    /* KH: Active Path output */ +/* KH: Active Path output */ 
-    /* KH: Ausgabe des aktiven Pfads */ +/* KH: Ausgabe des aktiven Pfads */ 
-    #pmenu li.act_path { +#pmenu li.act_path { 
-       background:#4161AF url(../../img/symbols/klapp_auf.gif) no-repeat 105px center; +   background:#4161AF url(../../img/symbols/klapp_auf.gif) no-repeat 105px center; 
-    /*   background:#cccccc url(../../img/article/navi/drop.gif) no-repeat right center; +/*   background:#cccccc url(../../img/article/navi/drop.gif) no-repeat right center; 
-       */ +   */ 
-    }+}
-    /* This lot is for IE5.5 and IE6 ONLY and is necessary to make the sublevels appear */ +/* This lot is for IE5.5 and IE6 ONLY and is necessary to make the sublevels appear */ 
-    /* change the drop down levels from display:none; to visibility:hidden; */ +/* change the drop down levels from display:none; to visibility:hidden; */ 
-    /* Dies ist fuer den IE5.5 und IE6 notwendig um die Unterebenen anzuzeigen */ +/* Dies ist fuer den IE5.5 und IE6 notwendig um die Unterebenen anzuzeigen */ 
-    /* Wechselt die Unterebenen von display:none; nach visibility:hidden; */+/* Wechselt die Unterebenen von display:none; nach visibility:hidden; */
-    * html #pmenu li ul { +* html #pmenu li ul { 
-       visibility: hidden; +   visibility: hidden; 
-       display: block; +   display: block; 
-       position: absolute; +   position: absolute; 
-       top: -11px; +   top: -11px; 
-       left: 80px; +   left: 80px; 
-       padding: 10px 30px 30px 30px; +   padding: 10px 30px 30px 30px; 
-       background: transparent url(../../img/article/leer.gif); +   background: transparent url(../../img/article/leer.gif); 
-    +
-    /* keep the third level+ hidden when you hover on first level link */ +/* keep the third level+ hidden when you hover on first level link */ 
-    #pmenu li a:hover ul ul { +#pmenu li a:hover ul ul { 
-       visibility: hidden; +   visibility: hidden; 
-    +
-    /* keep the fourth level+ hidden when you hover on second level link */ +/* keep the fourth level+ hidden when you hover on second level link */ 
-    #pmenu li a:hover ul a:hover ul ul { +#pmenu li a:hover ul a:hover ul ul { 
-       visibility: hidden; +   visibility: hidden; 
-    +
-    /* keep the fifth level hidden when you hover on third level link */ +/* keep the fifth level hidden when you hover on third level link */ 
-    #pmenu li a:hover ul a:hover ul a:hover ul ul { +#pmenu li a:hover ul a:hover ul a:hover ul ul { 
-       visibility: hidden; +   visibility: hidden; 
-    +
-    /* keep the sixth level hidden when you hover on fourth level link */ +/* keep the sixth level hidden when you hover on fourth level link */ 
-    #pmenu li a:hover ul a:hover ul a:hover ul a:hover ul ul { +#pmenu li a:hover ul a:hover ul a:hover ul a:hover ul ul { 
-       visibility: hidden; +   visibility: hidden; 
-    +
-    /* make the second level visible when hover on first level link and position it */ +/* make the second level visible when hover on first level link and position it */ 
-    #pmenu li a:hover ul { +#pmenu li a:hover ul { 
-       visibility: visible; +   visibility: visible; 
-       left: -30px;       /*          (IE5 ONLY) */ +   left: -30px;       /*          (IE5 ONLY) */ 
-       top: 10px;         /* ORG 14px (IE5 ONLY) */ +   top: 10px;         /* ORG 14px (IE5 ONLY) */ 
-       lef\t: -31px;      /*          (IE6 ONLY) */ +   lef\t: -31px;      /*          (IE6 ONLY) */ 
-       to\p: 11px;        /* ORG 15px (IE6 ONLY) */ +   to\p: 11px;        /* ORG 15px (IE6 ONLY) */ 
-    +
-    /* make the third level visible when you hover over second level link and position it and all further levels */ +/* make the third level visible when you hover over second level link and position it and all further levels */ 
-    #pmenu li a:hover ul a:hover ul { +#pmenu li a:hover ul a:hover ul { 
-       visibility: visible; +   visibility: visible; 
-       top: -11px;        /* ORG -11px (IE6 ONLY) */ +   top: -11px;        /* ORG -11px (IE6 ONLY) */ 
-       left: 80px; +   left: 80px; 
-    +
-    /* make the fourth level visible when you hover over third level link */ +/* make the fourth level visible when you hover over third level link */ 
-    #pmenu li a:hover ul a:hover ul a:hover ul { +#pmenu li a:hover ul a:hover ul a:hover ul { 
-       visibility: visible; +   visibility: visible; 
-    +
-    /* make the fifth level visible when you hover over fourth level link */ +/* make the fifth level visible when you hover over fourth level link */ 
-    #pmenu li a:hover ul a:hover ul a:hover ul a:hover ul { +#pmenu li a:hover ul a:hover ul a:hover ul a:hover ul { 
-       visibility: visible; +   visibility: visible; 
-    +
-    /* make the sixth level visible when you hover over fifth level link */ +/* make the sixth level visible when you hover over fifth level link */ 
-    #pmenu li a:hover ul a:hover ul a:hover ul a:hover ul a:hover ul { +#pmenu li a:hover ul a:hover ul a:hover ul a:hover ul a:hover ul { 
-       visibility: visible; +   visibility: visible; 
-    +
-    /* If you can see the pattern in the above IE5.5 and IE6 style then you can add as many sub levels as you like */+/* If you can see the pattern in the above IE5.5 and IE6 style then you can add as many sub levels as you like */
</code> </code>
deutsch/navigationen/dropdown_flyout/nav_horiz_dd.1265816806.txt.gz · Last modified: 2018/06/03 18:07 (external edit)
www.planmatrix.de www.chimeric.de Creative Commons License Valid CSS Driven by DokuWiki do yourself a favour and use a real browser - get firefox!! Recent changes RSS feed Valid XHTML 1.0