Navigationsleiste auf andere html?
Hallo, ich bin ziemlich neu was Websides programmieren angeht und ich finde kein gutes tutorial dazu, wie man wenn man eine Navigationsleiste hat z.b auf Getränke klickt und dann eine andere html/css Seite mit Getränken auftaucht etc.
versuche da auxh bisschen JavaScript mit rein zubringen d.h Benutze die Navigationsleiste von Material Design Lite.
Bin da bisschen überfragt und habe keine ahnung😅
<!-- Always shows a header, even in smaller screens. -->
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header">
<header class="mdl-layout__header">
<div class="mdl-layout__header-row">
<!-- Title -->
<span class="mdl-layout-title">Title</span>
<!-- Add spacer, to align navigation to the right -->
<div class="mdl-layout-spacer"></div>
<!-- Navigation. We hide it in small screens. -->
<nav class="mdl-navigation mdl-layout--large-screen-only">
<a class="mdl-navigation__link" href="">Link</a>
<a class="mdl-navigation__link" href="">Link</a>
<a class="mdl-navigation__link" href="">Link</a>
<a class="mdl-navigation__link" href="">Link</a>
</nav>
</div>
</header>
<div class="mdl-layout__drawer">
<span class="mdl-layout-title">Title</span>
<nav class="mdl-navigation">
<a class="mdl-navigation__link" href="">Link</a>
<a class="mdl-navigation__link" href="">Link</a>
<a class="mdl-navigation__link" href="">Link</a>
<a class="mdl-navigation__link" href="">Link</a>
</nav>
</div>
<main class="mdl-layout__content">
<div class="page-content"><!-- Your content goes here --></div>
</main>
</div>
2 Antworten
z.b auf Getränke klickt und dann eine andere html/css Seite mit Getränken auftaucht etc.
Bei einer statischen Website erstellst du eine weitere Seite (getraenke.html) und verlinkst diese innerhalb deiner Navigation.
<a href="getraenke.html">Getränke</a>
Die Seite "getraenke.html" enthält ebenso deinen Header samt Navigation sowie den Footer der Seite. Lediglich im Inhaltsbereich wird halt ein anderer Inhalt angezeigt. Bei einer dynamischen Seite würde man hingegen nur die neuen Inhalte laden.
Ich würde versuchen in den <a>-Tags die href="DEINE/GEWÜNSCHTE/URL" zu verwenden. Aktuell steht da nämlich nur href="", also ein leerer Wert.
Wie in der anderen Antwort. Du musst nun eine html-Datei erstellen für jeden Listeneintrag. Auf diese Datei verlinkst du dann in deinem Main-Html.
Und wie/wo würde ich denn z.b die getränkeliste erstellen wenn ich darauf weiterleite?
könntest du vielleicht mir ein beispiel mit dem code den ich genannt hatte zeigen?
und mit dem was du meinst das die seite sich dann auf Getränke ändert? Bin da ziemlich lost🥲
und danke für die fixe Antwort