# Newbie braucht Hilfe mit Navigation



## Vivalostios (22. Juli 2005)

Hallo,

bin absoluter Newbie und habe folgendes Problem, hätte gern so eine Navigation wie auf der Seite http://www.meads.de - 
hab mir auch schon eine Vorlage als Webseite runtergeladen auf der ich ein ähnliches Menü habe, aber jedesmal wenn ich ne neue Seite damit öffne, geht diese über das ganze Bild und ich hab ne komplett neue Seite ohne Menü...
Wie stell ich das an ? Kann mir jemand helfen ?
Meine Rohseitenvorlage ist unter Http://www.brandhofen.de/p11.zip

Bitte helft mir,
Gruß Vivalostios


----------



## T3ch (22. Juli 2005)

Hi;

also ich gebe dir mal drei Möglichkeiten:

1. Falls du PHP hast, kannst du deine Dateien per include()  einbinden.

2. Du änderst für jede neue Seite den Teil zwischen <!-- inhalt --> und <!-- ende haupt--> (Zeile 213-337) 

3. Du benutzt einen Inline frame (<iframe>) und erstellst für denselben Teil wie oben eine Datei; diese kannst du dann für jeden Link entsprechend anpassen. Über die Einbindung sowie die Verwendung (aber auch die Nachteile!) der Inline Frames gibt es schon einige Threads.

Greetz


----------



## Vivalostios (22. Juli 2005)

Danke erstmal für die Antwort...
also Php beherrsch ich nicht, wollte es halt so machen, dass bei dem Menü bei bestimmten Menüpunkten noch ein Untermenü aufgeht und dann wollt ich halt verschiedene Rubriken machen...
Ich hab irgendwie überhaupt keinen Plan davon...
Gibt es nicht die möglichkeit dass zu vereinfachen so nach dem Drag&Drop Prinzip
im Dreamweaver oder Frontpage oder so...
Wollte das eigentlich allein machen und kein Geld ausgeben für ne Firma die mir die Seite erstellt...
Die Vorlage ist da, aber sobald ich im Menü etwas verlinke auf ne neue Seite (z.b: seite2.htm) und den Link ausführe, dann öffnet sich die neue Seite über den ganzen Bildschirm und auch das Menü von der Index.html ist weg, ja nun hat ja der Besucher keine Möglichkeit mehr sich auf der Seite zu bewegen....
Wie löse ich das ?


----------



## Maik (22. Juli 2005)

Vivalostios hat gesagt.:
			
		

> sobald ich im Menü etwas verlinke auf ne neue Seite (z.b: seite2.htm) und den Link ausführe, dann öffnet sich die neue Seite über den ganzen Bildschirm und auch das Menü von der Index.html ist weg, ja nun hat ja der Besucher keine Möglichkeit mehr sich auf der Seite zu bewegen....
> Wie löse ich das ?


Hat dir _T3ch_ doch schon geschrieben   



			
				T3ch hat gesagt.:
			
		

> 2. Du änderst für jede neue Seite den Teil zwischen <!-- inhalt --> und <!-- ende haupt--> (Zeile 213-337)


und speicherst sie als *seite2.html, seite3.html, seite4.html* usw. 

Du duplizierst / kopierst die Vorlagenseite für deine weiteren Projektseiten und fügst den entsprechenden Inhalt ein. Somit erhälst du ein einheitliches Page-Layout incl. Navigation ...  ;-]


----------



## Vivalostios (22. Juli 2005)

Danke erstmal, das hab ich jetzt kapiert, aber wie schaff ich das, dass zum Beispiel, wenn ich im Menü auf "Bilder" klicke, noch ein Untermenü aufgeht, damit ich die Bilder in verschiedene Kategorien einteilen kann... ?

Mfg
Vivalostios


----------



## Maik (23. Juli 2005)

Um beim Klick auf einen Menüpunkt ein Submenü zu öffnen, ist JavaScript erforderlich.

Hier eine JavaScript - Variante:

```
<html>
<head>
<title> ... </title>

<script type="text/javascript">
<!--
function collapseMenu(id){

 if(document.getElementById(id).style.display == 'none')
 {
  document.getElementById(id).style.display = 'block';
 }
 else
 {
  document.getElementById(id).style.display = 'none';
 }

}
//-->
</script>

</head>
<body>
```
Das Layout deiner Vorlagenseite wurde mit verschachtelten Tabellen konstruiert und die Menüpunkte (Links) in einzelne Tabellenzellen gepackt. Demnach müsste das Untermenü innerhalb der Tabellenzelle eingesetzt werden, in der sich der Menüpunkt (Link) 'Bilder' befindet. 

Auszug aus dem Quelltext der Vorlagenseite mit dem entsprechenden Lösungsansatz:



```
<!-- menü 1 -->
<table width="160" border="0" cellpadding="0" cellspacing="1" id="menu1">
 <tr>
   <td bgcolor="#4E6F81" width="160" height="20" style="padding:4px"  background="images/balken.gif">&nbsp;&nbsp;Rubrik 1</td>
 </tr>
 <tr>
   <td width="160" background="images/back_button.jpg"><a href="index.html">&raquo;&nbsp;Home</a></td>
 </tr>
 <tr>
   <td width="160" background="images/back_button.jpg"><a href="kontakt.html">&raquo;&nbsp;Kontakt</a></td>
 </tr>
 <tr>
   <td width="160" background="images/back_button.jpg"><a href="impressum.html">&raquo;&nbsp;Impressum</a></td>
 </tr>
 <tr>
   <td width="160" background="images/back_button.jpg"><a href="news.html">&raquo;&nbsp;News</a></td>
 </tr>
 <tr>
   <td width="160" background="images/back_button.jpg"><a href="javascript:collapseMenu('submenu1')">&raquo;&nbsp;Bilder</a>
      <div id="submenu1" style="display: none;">
          <a href="#">Sublink 1</a>
          <a href="#">Sublink 2</a>
          <a href="#">Sublink 3</a>
          <a href="#">Sublink 4</a>
          <a href="#">Sublink 5</a>
          <a href="#">Sublink 6</a>
          <a href="#">Sublink 7</a>
          <a href="#">Sublink 8</a>
          <a href="#">Sublink 9</a>
          <a href="#">Sublink 10</a>
      </div>
   </td>
 </tr>
</table>
```


[ editpost 09:26 ]  

Mir ist gerade aufgefallen, dass in der Seite alle Rubriken (Hauptmenüs) die gleiche ID *#menu1* besitzen, was *nicht* zulässig ist. 

Entweder gibst du jeder Rubrik eine individuelle ID:


```
<!-- menü 1 -->
<table width="160" border="0" cellpadding="0" cellspacing="1" id="menu1"> ... </table>

<!-- menü 2 -->
<table width="160" border="0" cellpadding="0" cellspacing="1" id="menu2"> ... </table>

<!-- menü 3 -->
<table width="160" border="0" cellpadding="0" cellspacing="1" id="menu3"> ... </table>
```

oder du arbeitest mit einer CSS-Klasse *.menu*, die in einem Dokument mehrfach vergeben werden darf:


```
<!-- menü 1 -->
<table width="160" border="0" cellpadding="0" cellspacing="1" class="menu"> ... </table>

<!-- menü 2 -->
<table width="160" border="0" cellpadding="0" cellspacing="1" class="menu"> ... </table>

<!-- menü 3 -->
<table width="160" border="0" cellpadding="0" cellspacing="1" class="menu"> ... </table>
```


----------



## Vivalostios (23. Juli 2005)

Danke erstmal, das Menü funktioniert, aber wenn ich jetzt die Seiten so mache wie T3ch sein Vorschlag war, also die Hauptseite vervielfältigen und dann nur als seite2, 3 usw. abspeichern.
Da kann ich ja mit dem Javamenü nix mehr anfangen oder ?
Das Javamenü würde mir nur was bringen wenn ich die ganze Seite mit php mache oder ?
Weil wenn ich die Seiten kopiere, ist ja jedesmal das Menü wieder zusammengeklappt, obwohl, könnte man trotzdem machen...
geht es eigentlich das menü extern zu haben und bloß sozusagen auf jede einzelne Seite zu "projezieren", weil sonst muss ich ja, wenn ich die Seite aktualisiere, das Menü in jeder einzelnen Seite ändern und das ist bestimmt ziemlich aufwändig...
Gibts da ne Möglichkeit für ?


----------



## Maik (23. Juli 2005)

Für deine Vorstellungen ist ein umfangreicheres / komplexeres JavaScript erforderlich, als ich es dir heute Morgen vorgestellt habe. Da ich aber nicht der 'Script-Guru' bin, kann ich dir leider auch nicht weiterhelfen.

Wende dich mal an das JavaScript - Forum. 

Dort gibt es 'Script-Profis' (wie z.B. Sven Mintel), die dir sicherlich weiterhelfen können.


[ editpost 12:34 ]

Oder nutze die Suchfunktion in dem JavaScript - Forum -> z.B. Untermenü, um nach ähnlichen Problemstellungen / -lösungen zu recherchieren ;-]


----------

