DHTML Menü

[stephanl]

Hi,

das sieht super aus, meine Frage:

Kann man das so automatisieren, dass es die Kategorien allein erstellt?

Das wäre echt cool, sonst isses super

Danke schon mal


Stephan

[MakD]

DHTML-Navigation geht bei mir nicht!

Hallöchen,

habe exakt nach solch einem Modul gesucht – aber bei mir bekomme ich es nicht zum laufen.

Habe die Version hier mit der Modifikation im einsatz.

Habe folgenden Teil in den Head kopiert: (bei mir Container 1)

Code: Alles auswählen

<!-- JScript Menü--> 
<script type="text/javascript" src="js/doiMenuDOM.js"></script> 
<!-- JScript Menü -> Menüpunkte: --> 
<script language="JavaScript"> 
<!-- 
CMS_CONTAINER[1] 
//--> 
</script> 
<!-- JScript Menü -> Einstellungen --> 
<script type="text/javascript" src="js/menu_settings.js"> 
</script>

und folgenden Teil an die Stelle im Layout, an welchem der Container sonst liegt:

Code: Alles auswählen

<div align="left"><!--DHTML NAVI--><script language="JavaScript">menue.Build();</script></div>

Anschließend habe ich folgenden Code in den In- und Output eines neuen Moduls kopiert:

Code: Alles auswählen

// Auswahl Kategorie --> Beginn 
/*********************************************** 
* CONTENIDO MODUL - INPUT 
* 
* Modulname   :     DHTML-Menü 
* Author      :     Uli Steinle / D2MAC 
* Copyright   :     stonecore media 
* Created     :     21-03-2004 
* Modified    :     bestimmt bald 
************************************************/ 
// selected category 
$selected = "CMS_VALUE[0]"; 

echo "<table cellspacing=\"0\" cellpadding=\"10\" border=\"0\"> 
        <tr valign=\"top\"> 
          <td>Kategorie wählen:</td> 
          <td> 
            <select name=\"CMS_VAR[0]\">"; 
            if($selected!="0" && $selected!=""){ 
             echo"<option value=\"0\">--- kein ---</option>"; 

            }else{ 
            echo"<option selected=\"selected\" value=\"0\">--- kein ---</option>"; 
            } 

            // fetch all categorys 
            $query = "SELECT A.idcat, A.level, C.name FROM ".$cfg["tab"]["cat_tree"]." AS A, ". 
                     $cfg["tab"]["cat"]." AS B,  ".$cfg["tab"]["cat_lang"]." AS C WHERE A.idcat=B.idcat ". 
                     "AND B.idcat=C.idcat AND C.idlang='$lang' AND B.idclient='$client' ". 
                     "AND C.visible=1 ORDER BY A.idtree"; 
            // execute query 
            $db->query($query); 

            // loop result and build the options 
            while ($db->next_record()) { 

              // indent spacer 
              $spaces = "|"; 

              // how many levels 
              $levels = $db->f("level"); 

              for ($i = 0; $i < $levels; $i ++) { 
                // add 2 spaces for every level 
                $spaces = $spaces . "--"; 

              } // end for 
              
              $spaces .= ">"; 


              if ($selected == $db->f("idcat")) { 
                // selected category 
                echo "<option selected=\"selected\" value=\"". $db->f("idcat") ."\">". $spaces . $db->f("name") ."</option>"; 

              } else { 
                // category 
                echo "<option value=\"". $db->f("idcat") ."\">". $spaces . $db->f("name") ."</option>"; 

              } // end if 

            } // end while 

echo "      </select>"; 

echo "    </td> 
        </tr> 
      </table>"; 
// Auswahl Kategorie <-- Ende

OUTPUT

Code: Alles auswählen

<? 
/*********************************************** 
* CONTENIDO MODUL - OUTPUT 
* 
* Modulname   :     DHTML-Menü 
* Author      :     Uli Steinle / D2MAC 
* Copyright   :     stonecore media 
* Created     :     21-03-2004 
* Modified    :     bestimmt bald 
************************************************/ 
include_once($cfg["path"]["contenido"].$cfg["path"]["includes"]."functions.con.php"); 

$catStart = "CMS_VALUE[0]"; 

echo "var menue = new TMainMenu('menue','vertical');\n"; 

if ($catStart != "") { 
  $catIds = conDeeperCategoriesArray($catStart); 

  if ( is_array($catIds) ) { 
$tmp_counter = 0; 

    foreach($catIds as $key=>$val) { 

      if ($key != 0) { 

        $sql = "SELECT 
                    CAT.idcat AS idcat, name ,parentid, level 

                FROM 
                    ".$cfg["tab"]["cat"]." AS CAT, 
                    ".$cfg["tab"]["cat_lang"]." AS CATLANG, 
                    ".$cfg["tab"]["cat_tree"]." AS CATLEVEL 

                WHERE 
                    CAT.idcat        = ".$val." AND 
                    CAT.idcat        = CATLANG.idcat AND 
                    CATLANG.idlang   = '$lang' AND 
                    CATLANG.visible  = '1' AND 
                    CAT.idcat        = CATLEVEL.idcat"; 

        $db->query($sql); 

//echo "/* \n".$sql."*/ \n"; 

//NH 
   $nh_db = new DB_Contenido; 
    
while ( $db->next_record() ) { 

          $level    = $db->f("level"); 
          $name     = $db->f("name"); 
          $parent   = $db->f("parentid"); 
          $cat      = $db->f("idcat"); 
          $url      = "front_content.php?idcat=$cat&lang=$lang"; 
     $a="a"; 
    
   /* NH---------------------------------------------*/ 
    $nh_idcat=$cat; 
    
     $query2 = "SELECT ARTLANG.idartlang, ARTLANG.title FROM ". 
      $cfg["tab"]["cat"]." AS CAT, ". 
      $cfg["tab"]["cat_art"]." AS CATART, ". 
      $cfg["tab"]["art"]." AS ART, ". 
      $cfg["tab"]["art_lang"]." AS ARTLANG ". 
         "WHERE 
       CAT.idcat='$nh_idcat' 
    AND 
       CATART.idcat = CAT.idcat  
    AND 
       ART.idart = CATART.idart 
    AND 
       ART.idart = ARTLANG.idart 
   AND 
       ARTLANG.idlang = '$lang' 
    AND 
       ART.idclient = '$client' 
    AND 
       ARTLANG.online = '1' "; 
    
   $nh_db->query($query2); 
   if(!$nh_db->nf()){ 
      $url      = ""; 
      $a      = ""; 
   } 
    
    
   /* NH END---------------------------------------------*/ 


          switch ($level) 
          { 

           //level1 
           case (1): 
                echo "var paul=10;\n"; 
                unset($count1);                  
                unset($count2); 
                unset($count3); 
                unset($count4); 
                unset($count5); 
                unset($count6); 
                unset($count7); 
                unset($count8); 
                unset($count9); 
                $levels1 = 1+$count1++; 

                echo "var Menue_".$levels1." = new TPopMenu('".$name."','5','$a','".$url."','".$name."');\n"; 
                echo "menue.Add(Menue_".$levels1.");\n\n"; 
                
                break; 

           //level2 
           case (2): 
                echo "var paul2=20;\n"; 
                $levels2=1+$count2++; 
              
          echo "  var Menue_".$levels1."_".$levels2." = new TPopMenu('".$name."','5','$a','".$url."','".$name."');\n"; 
                echo "  Menue_".$levels1.".Add(Menue_".$levels1."_".$levels2.");\n\n"; 
            
           break; 

           //level3 
           case (3): 

                $levels3=1+$count3++; 
                
                echo "    var Menue_".$levels1."_".$levels2."_".$levels3." = new TPopMenu('".$name."','5','$a','".$url."','".$name."');\n"; 
                echo "    Menue_".$levels1."_".$levels2.".Add(Menue_".$levels1."_".$levels2."_".$levels3.");\n\n"; 
           break; 

           //level4 
           case (4): 
                $levels4=1+$count4++; 
                echo "      var Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4." = new TPopMenu('".$name."','5','$a','".$url."','".$name."');\n"; 
                echo "      Menue_".$levels1."_".$levels2."_".$levels3.".Add(Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4.");\n\n"; 
           break; 

           //level5 
           case (5): 
                $levels5=1+$count5++; 
                echo "         var Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4."_".$levels5." = new TPopMenu('".$name."','5','$a','".$url."','".$name."');\n"; 
                echo "          Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4.".Add(Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4."_".$levels5.");\n\n"; 
           break; 

           //level6 
           case (6): 
                $levels6=1+$count6++; 
                echo "           var Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4."_".$levels5."_".$levels6." = new TPopMenu('".$name."','5','$a','".$url."','".$name."');\n"; 
                echo "           Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4."_".$levels5.".Add(Menue_".$levels1."_".$levels2."_".$levels3."_".$levels4."_".$levels5."_".$levels6.");\n\n"; 
            
           break; 
          } 
        } // end while 
      } // if 
    }  // end foreach 
  } // end if (is_array) 

} 
?> 

Anschließend wurden im Skripeditor folgende Skripte erzeugt:

Menu_settings.js

Code: Alles auswählen

menue.SetPosition('relative',0,0); 
menue.SetCorrection(0,0); 
menue.SetCellSpacing(0); 
menue.SetItemDimension(90,15); 

menue._pop.SetItemDimension(90,15); 
menue._pop.SetPaddings(2); 
menue._pop.SetSeparator(125,'right','gray',''); 
menue._pop.SetExpandIcon(true,'',6); 
menue._pop.SetFont('tahoma,verdana,arial','8pt'); 
menue._pop.SetBorder(1,'gray','solid'); 
menue._pop.SetDelay(500); 

und

doiMenuDOM.js aus der Dokumentation den Skriptes.

Ich habe das Template auf einer bis jetzt noch nicht mit Inhalten gefüllten Seite eingestellt – aber es kommt überhauptnichts.

Habe versucht in dem Template und auf der Seite selbst das Modul zu konfigurieren aber ohne einen Effekt.

Hier der HTML Ouellcode von der Seite mit dem Modul:

Code: Alles auswählen

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
        <title>Familientag 2006</title>
        <link rel="stylesheet" type="text/css" href="css/format.css">

<!-- JScript Menü--> 
<script type="text/javascript" src="js/doiMenuDOM.js"></script> 
<!-- JScript Menü -> Menüpunkte: --> 
<script language="JavaScript"> 
<!-- 
var menue = new TMainMenu('menue','vertical');
 

 
//--> 
</script> 
<!-- JScript Menü -> Einstellungen --> 
<script type="text/javascript" src="js/menu_settings.js"> 
</script>

<meta name="generator" content="CMS Contenido 4.4.4">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

</head>
<body topmargin="7" leftmargin="0">

<table align="center" cellspacing="0" cellpadding="0" border="0" width="770">
<tr>
 <td><nobr>

   <table cellspacing="0" cellpadding="0" align="center" height="90" width="770" border="0">
    <tr>
     <td background="images/_top1.jpg"></td>
    </tr>
   </table>

   <table cellspacing="0" cellpadding="0" bgcolor="#00003F" height="15" width="770">
    <tr>
     <td align="right"><table cellpadding="0" cellspacing="0" border="0"><tr><td><img src="images/wuerfel.gif"></td><td height="15" class=".navigation" style=padding-left:7px; padding-right:7px;">
          <a class="klein" target="_self" href="front_content.php?idcat=4">Home&nbsp;&nbsp;</a></td><td height="15" class=".navigation" style=padding-left:7px; padding-right:7px;">
          <a class="klein" target="_self" href="front_content.php?idcat=5">Impressum&nbsp;&nbsp;</a></td><td height="15" class=".navigation" style=padding-left:7px; padding-right:7px;">
          <a class="klein" target="_self" href="front_content.php?idcat=6">Kontakt&nbsp;&nbsp;</a></td><td height="15" class=".navigation" style=padding-left:7px; padding-right:7px;">
          <a class="klein" target="_self" href="front_content.php?idcat=28">Suche&nbsp;&nbsp;</a></td></tr></table></td>
    </tr>
   </table>

   <table bgcolor="" cellspacing="0" cellpadding="0" width="770">
    <tr>
     <td valign="top">
     <table bgcolor="#EBECEC" align="left" cellspacing="0" cellpadding="0" border="0" width="161">
          <tr>
           <td valign="top" align="left" height="23" width="161"><img src="images/_navtop.jpg" border="0"</td>
          </tr>
          <tr>
           <td bgcolor="#EBECEC"><div align="left"><!--DHTML NAVI--><script language="JavaScript">menue.Build();</script></div></td>
          </tr>
            <tr>
           <td bgcolor="#EBECEC"><table width="161" border="0" cellspacing="0" cellpadding="0">
<tr><td height="30" colspan="2" ></td></tr>
<tr><td height="15" width="15" style="border: 0px; border-top:1px; border-bottom:1px; border-color: #000000; border-style: solid; background-color: #EBECEC"><img src="images/wuerfel.gif" width="15" height="15" border="0"></td>
<td width="146" style="border: 1px; border-left:0px; border-color: #000000; border-style: dashed; background-color: #FFFFFF; padding-left:10px" class="punkte">Family-Login</td></tr>
<tr><td colspan="2" class="text" height="20" style="border: 1px; border-top:0px; border-color: #000000; border-style: dashed; background-color: #EBECEC; padding-left:10px">
<form method="post" action="front_content.php?idcatart=23">
<table border="0">
<tr><td>Benutzername</td></tr>
<tr><td><input class="news" type="input" size="11" name="username" value=""></td></tr>
<tr><td>Passwort</td></tr>
<tr><td><input class="news" type="password" size="11" name="password" value=""></td></tr>
</table>
&nbsp;<input class="news" type="submit" name="login" value="Anmelden">
</form><br>
</td></tr></table>
</td>
          </tr>
      </table>
      <td valign="top">

      <table bgcolor="#FFFFFF" cellspacing="10" cellpadding="5" border="0">
          <tr>
           <td width="609" height="25" class="headline">&nbsp;Familientag 2006</td>
          </tr>
          <tr>
           <td height="22" width="609" id="b" class="subheadline">&nbsp;</td>
          </tr>
          <tr>
           <td class="text">&nbsp;</td>
          </tr>
      </table>

     </td>
    </tr>
   </table>

   <table cellspacing="0" cellpadding="0">
    <tr>
     <td bgcolor="#00003F" height="15" width="770"></td>
    </tr>
     <tr>
     <td height="50" background="images/_bottom1.jpg" width="770"></td>
    </tr>
   </table>

 </nobr></td>
</tr>
</table>

</body>
</html>

Hier der Link zu der Seite mit dem Modul;
http://www.blomeyer-ev.de/d/cms/front_c ... p?idcat=16

Hat jemand eine Idee woran es liegen kann?

Danke MakDba

[wildtaube]

Hi!

Wollte mal fragen - bevor ich das Tool selbst nutze: habt Ihr Probleme bei nicht-Microsoft-Browsern? Z.b. Mozilla, Konqueror etc.?

Alex

Sehe ich das richtig, dass es mit dem Netscape 4.7 nicht funktioniert und auch keine Ersatznavigation angezeigt wird?

[kenzo]

Muß erst einmal loswerden, das die Navi super funktioniert.
Allerbestens also auch meine Lobeshymnen.
Eine kleine Frage habe ich dann doch noch.

Hat jemand eine IDEE wie ich die Icons in die Navi bekomme, ebenso wie
in den Demos auf http://www.donnaiwan.com/doiMenu/demo/index.html?

Laßt es mich wissen.


Danke

[ulisteinle]

Servus kenzo,

nur mal Theoretisch:

Um einen Menüpunkt mit Icon zu erzeugen muss man dem zweiten Parameter:

Code: Alles auswählen

echo "var Menue_".$levels1." = new TPopMenu('".$name."','---BILDURL---','$a','".$url."','".$name."');\n";

Hier also ---BILDURL--- die URL des Icons, das angezeigt werden soll mitgeben.

Nicht ganz trivial, da ja für jeden Menüpunkt ein anderes Ichon verwendet werden soll - oder auch keines.

Mein Ansatz wäre in etwa folgender:
1. Einen Ordner definieren, in dem die Icons liegen.
2. Icons hinterlegen, die genau so heißen wie die Menüpunkte.
3. Zu Beginn des Ouputs den Ordnerinhalt einlesen und die Iconnamen in ein Array ablegen.
4. Innerhalb jedes SELECT CASE Blocks abfragen, ob es ein Icon mit dem identischen Namen $name gibt.
5. Wenn ja: die URL zum Icon bei ---BILDURL--- einfügen.

Ich weiß, dass du sicher gerne eine fertige Lösung gehabt hättest, aber ich packe das gerade zeitlich nicht... Aber mit etwas PHP Wissen ist das recht zügig zu schaffen. - Sollte dieses Wissen (noch) nicht vorhanden sein, so ist das ein schönes Beispiel um sich´s anzueignen

Gruß
Uli

[kenzo]

Servus kenzo,

nur mal Theoretisch:

Um einen Menüpunkt mit Icon zu erzeugen muss man dem zweiten Parameter:

Code: Alles auswählen

echo "var Menue_".$levels1." = new TPopMenu('".$name."','---BILDURL---','$a','".$url."','".$name."');\n";

Hier also ---BILDURL--- die URL des Icons, das angezeigt werden soll mitgeben.

Nicht ganz trivial, da ja für jeden Menüpunkt ein anderes Ichon verwendet werden soll - oder auch keines.

Mein Ansatz wäre in etwa folgender:
1. Einen Ordner definieren, in dem die Icons liegen.
2. Icons hinterlegen, die genau so heißen wie die Menüpunkte.
3. Zu Beginn des Ouputs den Ordnerinhalt einlesen und die Iconnamen in ein Array ablegen.
4. Innerhalb jedes SELECT CASE Blocks abfragen, ob es ein Icon mit dem identischen Namen $name gibt.
5. Wenn ja: die URL zum Icon bei ---BILDURL--- einfügen.

Ich weiß, dass du sicher gerne eine fertige Lösung gehabt hättest, aber ich packe das gerade zeitlich nicht... Aber mit etwas PHP Wissen ist das recht zügig zu schaffen. - Sollte dieses Wissen (noch) nicht vorhanden sein, so ist das ein schönes Beispiel um sich´s anzueignen

Gruß
Uli

Hallo Uli,

erst einmal ein großes Dankeschön.
Oooops das wird schwierig!
Bin bisher , was PHP betrifft, unbeleckt, und dann gleich mit Array beginnen, das wird schwierig.
Vieleicht komme ich mich irgendwie zurecht. Werde es versuchen, und wennnicht, dann hoffe ich auf Eure Deine Hilfe, wenn Du mal Zeit hast.


Danke noch einmal.


Kenzo

[Salech]

Hallo,
ist es eigentlich möglich jedem Hauptmenüpunkt eine separate Farbe zuzuweisen?
Die dann natürlich auch für die jeweiligen Unterbereiche gilt!

Dann wäre die Navi perfekt.

Gruß und Danke

[Salech]

Schade anscheinend geht es nicht...

[MurphysDr]

Zwei Fragen zu diesem schicken Menü:

- Das Problem mit der Mehrfarbigkeit trifft bei mir auch zu. Ist es Möglich das Script, bzw. die Einstellungen mehrfach zu verwenden (Pro Baum eine Einstellungsdatei)?

- Ist es Möglich, die Unterpunkte nach oben zu öffnen? bzw. Wo im Script finde ich das positionieren der einzelnen Unterpunkte und des Layers? Einfach den Layer nach oben schieben geht ja nicht, da es dann unterschiedlich große Lücken gibt.

Eigentlich soll das ganze nämlich mal so aussehen:
http://www.vollbild.net/mediasolutions/ ... daktik.php

aktueller Stand ist jetzt dies: http://business-illustrationen.de/contenido/cms/

Und hartcoden wollte ich es nicht

edit:

Habe es, wie man sieht, jetzt geschafft
Habe ein anderes Script umgearbeitet. Sobald ich etwas Luft habe, arbeite ich es mal komplett aus (bisher nur 2 Stufen) und stelle es hier rein.

Das einzige, was jetzt noch manuell gemacht werden muß, ist die Grafik des "Startbuttons" der Menüs, also die Hauptkategorie.

[bazz-design]

Hey Leutz. Erstmal Respekt an den programmierer der Supernavi.

Aber ich hab da ein kleines Problem ich will das Menü in eine 16 px hohe td reinkriegen. Welche Optionen oder parameter soll ich dafür anwenden?

anschauen könnt ihr euch das unter www.passgang-bau.de/cms

Die Font- und size hab ich schon auf 10 px runtergesetzt, aber irgendwie liegt noch eine Ebene dahinter die das alles für mich komplizierter macht.

Gruß Bazz

[Oraj]

hi @ all

Also, ich hab ein Problem mit dem Menü. Sobald ich einen Punkt in Level 3 einfüge, zerschiesst es mir das Menü.

Das ganze sieht dann so aus.



Weiss jemand woran das liegen könnte?

Ich hab alles eins zu eins aus diesem Thread kopiert.

[SSH]

Hallo zusammen!

Hat jemand von Euch das Navi-Modul in der letzten Zeit funktionieren in Centenido integriert?

Ich habe es mit dem Modul-Code von der ersten Seite dieses Beitrages und der Version 1.53 vom Super-Menü versucht (Contenido 4.4.5). Leider ohne Erfolg. Ich bekomme statt dem Menü immer nur ein kleines graues Kästchen (wohl das <div>) angezeigt. Die Eingabe der Kategorie zu einem Artikel (Modul-Eingabe) funktioniert augenscheinlich.

Binde ich das Menü von Hand (ohne CMS_CONTAINER und von Hand definierten Variablen) ein, funktioniert es problemlos. Das Problem liegt anscheined irgendwo im Modul begraben. Evtl. hat der Super-Menü-Programmierer in der aktuellen Version (1.53) etwas geändert.

Unabhängig davon:
Legt man in Contenido einen Artikel an, kann man ja eine Kategorie angeben, in der das "Super-Menü" diesen Anzeigen soll. Wer kann mir mal kurz erklären, wo das Modul diese Infos (Variablen) hinschreibt. Datenbank?

Schon mal danke im Voraus.

Grüße

SSH

[HerrB]

Legt man in Contenido einen Artikel an, kann man ja eine Kategorie angeben, in der das "Super-Menü" diesen Anzeigen soll. Wer kann mir mal kurz erklären, wo das Modul diese Infos (Variablen) hinschreibt. Datenbank?

Hmmm? Was ist das "Super-Menü"?

Meinst Du - unabhängig von dem Navi-Modul - dass man eine Kategorie angeben kann, in der der Artikel erscheinen soll (a)? Oder das man die Kategorie auswählen kann, die das Navi-Modul anzeigen soll (b)?

Wenn a): Bitte mache ein separates Thema zu dieser Frage auf ("bleib beim Thema"). Ansonsten: Ja, in der DB, da gibt es etliche Tabellen, die das realisieren (welche? -> Neues Thema... ).

Wenn b): Dann nehme ich an, Du meinst die Konfiguration. Dann wird es auch in der DB in der con_content-Tabelle gespeichert. Was genau möchtest Du da wissen?

Gruß
HerrB

[SSH]

Hallo!

Mit "Super-Menü" und Navi-Modul ist das hier im Beitrag angesprochene DHTML-Menü gemeint. Alle Fragen beziehen sich darauf.

Für dieses DHTML-Menü muß man die Kategorien noch einmal gesondert (unabhängig vom original Navi-Modul) angeben => wo speichert das DHTML-Menü diese Daten (Variablen) ab. usw.

Gruß

SSH

[HerrB]

Dachte ich es mir doch, also b).

Du wählst die Kategorie in der Konfiguration aus. Der Wert wird über die CMS_VAR und CMS_VALUE-Variablen gespeichert.

Ich mache es mir zunächst leicht: Was möchtest Du denn damit machen? Wenn Du es innerhalb des Moduls verwenden möchtest, steht die ID der Kategorie in CMS_VALUE[0], d.h.

Code: Alles auswählen

$category = "CMS_VALUE[0]";

liefert eine Variable mit der ID der gewählten Kategorie.

Gruß
HerrB