650 Aufrufe
Gefragt in Webseiten HTML von
Hi Leute,

ich beginne grad erst mich mit HTML zu beschäftigen, da ich eine
relativ simple Web-Seite aufbauen möchte. Große Ansprüche habe ich
vorerst nicht an das Layout, außer Einem. Ich möchte im
Inhaltsverzeichnis, das sich am linken Bildschirmrand befindet, hinter
einigen Links Sublinks hinterlegen, die erst dann angezeigt werden,
wenn der Hauptlink angeklickt wird. Die darunter stehenden Links
sollen dann ein Stück nach unten rutschen.
Das Feld mit den Hauptlinks befindet sich zurzeit in einer dwt-Datei, die
an ein CSS-Layout geknüpft ist. Ist mein Wunsch mit HTML umsetzbar
oder geht das nur mit PHP, ASP, Java, VBScript etc.?

Als Web-Editor nutze ich zurzeit Microsoft Expression Web 4, da dieser
nach mehreren Fehlschlägen (Wordpress usw.) für mich als Anfänger
derzeit am einfachsten zu handeln ist.

Danke für eure Hilfe.

7 Antworten

0 Punkte
Beantwortet von
Ich habe make-sub-links-appear-when-mouse-upon-a-link">hier selbst eine
Lösung gefunden die auch funktioniert. Allerdings poopen die
Unterlinks bereits auf wenn man nur mit der Maus drüber fährt. Ich
möchte aber, dass das erst passiert wenn man auf den
entsprechenden Link klickt. Außerdem soll der Link gleichzeitig seiner
Standardfunktion nachkommen und eine Einleitungs-Seite für diese
Rubrik öffnen. Wie muss ich diesen Code anpassen, damit das
funktioniert?
0 Punkte
Beantwortet von computerschrat Profi (32.2k Punkte)
Hallo WindowsUser,

mit reinem HTML wirst du die dynamische Linkliste nicht aufbauen können. HTML ist statisch und kennt , soweit ich das weiß, weder Varieblen, noch bedingte Anweisungen.

Mit PHP habe ich das schnon gemacht, da geht das sehr einfach. Da erzeugst du mit dem Klick auf eine der Haupteinträge im Inhaltsverzeichnis eine Variable. Bei der Ausgabe kannst du dann vor der Ausgabe der Einträge für einen Sublink die Variable abfragen.

Also nenne deine Haupteinträge z.B.
ThemaA, ThemaB und ThemaC
Dann gibt es eine SessionVariable WoBinIch
Wenn du auf den Eintrg ThemaB klickst, setzt du die Variable

<?php
$_SESSION['WoBinIch']="ThemaB";
?>

In der Ausgabe der Sublinks für die Linkliste steht dann
<?php
if ($_SESSION[WoBinIch']=="ThemaB")
{echo"<p><a href= hier steht ein Sublink für ThemaB...."}
?>


Damit wird der Sublink zu ThemaB nur ausgegeben, wenn vorher mal auf die Haupütüberschrift zu ThemaB geklickt wurde.
Eine Session-Variable ist hier deshalb wichtig, damit die Variable beim erneuten Aufruf der Seite nicht verloren geht.

Gruß
computerschrat
0 Punkte
Beantwortet von computerschrat Profi (32.2k Punkte)
Hallo WindowsUser,

unsere beiden Beiträge haben sich überschnitten und mir war es dann zu spät nochmal zu antworten.

Dass in deinem gefundenen Beispiel die Unterlinks beim Darüberfahren mit der Maus aufpoppen wird über die Eigenschaft hover im CSS geregelt. Normalerweise wird der Teil
<li> ... </li> nicht angezeigt, Erst wenn die Maus über dem <ul> Block steht, wird <li> angezeigt.

Versuch mal hover durch active zu ersetzen, vielleicht klappt das.

Hier ist noch eine kurze Erläuterung dazu:
https://wiki.selfhtml.org/wiki/CSS/Selektoren/Pseudoklasse/hover,_active,_focus

Gruß
computerschrat
0 Punkte
Beantwortet von flupo Profi (17.7k Punkte)
Wieso soll das mit statischen Seiten nicht gehen?
Es ist doch nur eine Frage was passiert, wenn ich einen Menülink anklicke. Wenn die aufgerufene Seite dann das aufgeklappte Menü enthält, ist das Ziel doch eigentlich erreicht.
Modernes Webdesign ist das dann aber nicht mehr.

Gruß Flupo
0 Punkte
Beantwortet von computerschrat Profi (32.2k Punkte)
@Flupo,

du hast schon Recht, mit einem Link kann man eine Seite aufrufen, die dann das erweiterte Menü enthält. Aber diese Holzhammermethode wollte ich nicht ernshaft jemandem vorschlagen, der sich gerade in die Webprogrammierung einarbeitet :-)

Gruß
computerschrat
0 Punkte
Beantwortet von
Hallo zusammen,

ich hatte auch schon an eine statische Lösung gedacht, indem ich mehrere DWT-Dateien mit Teilen der Menüliste ausstatte und diese an die gleiche CSS binde. Auf Dauer ist mir das aber zuviel Anpassungsaufwand. Außerdem möchte ich unnötige Zwischenladezeiten beim Durchklicken durch das Menü verhindern.

Die Variante in Antwort 1 entspricht schon eher meiner Vorstellung. Nur finde ich keinen sinnvollen Selektor, der so arbeitet, wie gewünscht. Active erweitert zwar die Liste erst bei Klick - so wie geplant - aber nur solange ich die Maustaste weiterhin gedrückt halte. Schuld daran dürfte wohl diese Zeile sein.
ul > li > ul { display:none; }
Die ist zu Beginn auch wichtig, um die Submenüs zu entfernen, aber dann sollte sie erst wieder ausgeführt werden, wenn ein anderer Hauptlink angeklickt wurde. Kann man da eine Bedingung drum machen?

Sonst bleibt mir wohl doch nur die Lösung über PHP, wie von Computerschrat vorgeschlagen. Allerdings scheitert es derzeit noch an einer Vorschaumöglichkeit. Zwar ist mein Editor gemäß dieser Anleitung dazu in der Lage, nachdem man die PHP-Installations-Daten von hier heruntergeladen hat. Aber dann soll man in den Setting den Pfad zur PHP-cgi.exe hinterlegen. Diese Datei ist aber nicht im Ordner enthalten. Wo bekomme ich die her?

Außerdem behauptet die PHP-Website dass PHP 7 die Installation von Visual Studio 2015 erfordert. Das wollte ich jetzt nicht erst für teuer Geld kaufen, wegen so einer Lapalie.

Gibt es vielleicht noch andere Möglichkeiten mein Vorhaben umzusetzen?
0 Punkte
Beantwortet von computerschrat Profi (32.2k Punkte)
Hallo WindowsUser,

ich habe bisher Microsoft WebMatrix für meine Webseiten benutzt. Das hatte den Vorteil, dass es alle benötigten Pakete für die jeweilige Programmierung mitinstallieren konnte. Leider ist das Projekt eingestellt und Microsoft empfiehlt stattedessen Visual Studio Code. Auch das ist kostenfrei, ich konnte mich damit allerdings bisher nicht anfreunden.

Um mit PHP zu arbeiten musst du nicht zwingend Visual Studio installieren. Schau mal nach XAMPP. Das ist auch ein Paket, das alle nötigen Tools für die Web-Programmierung mitbringt und auch das ist kostenlos.

Vorschau in dem Sinn einer dynamischen Vorschau während des Programmierens kenne ich für Webseiten die PHP enthalten in keinem der Entwicklungstools. Du must die Ausführung immer starten oder die Seite neu aufrufen, um das Ergebnis der bisherigen Programmierung zu sehen.

Gruß
computerschrat
...