Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „Schwieriges Menü mit Javascript umsetzen?“

Pfohl

Nicht mehr ganz neu hier

Morgen,
ich erstelle derzeit einem Freund eine neue Homepage!

Die Seite (derzeit noch im Aufbau) findet ihr hier:

Grundgerüst steht aber, und der Quelltext dazu ist bis auf die linke Spalte (left column) fertig.



Ich möchte in die Linke Spalte (id="left column") ein Untermenü einbauen (siehe Bild), das jeweils einem der 4 Menüpunkte im Menü unter dem Header (id="menue") zugeordnet ist.
Zusätzlich hätte ich gerne den Hover-Effekt, wie auf dem jpg zu sehen.

Die Fotos, links des Menüs, sollen passend zum jeweiligen Menüpunkt wechseln. (Heizung -> Foto einer Heizung, Solar -> Bild einer Solaranlag, etc. ...)

Mein Problem ist die Umsetztung. Durch den Bogen im Menü, werde ich mit einer Unsorted List wie beim oberen Menü nicht weiter kommen!?
Außerdem sollen ja die Bilder links davon wechseln! :uhm:

Frage:
Wie setze ich es am besten um? -> Bietet Javascript hier möglichkeiten?; speziell auch für den Bilderwechsel. Irgend ein if.this.page - this.photo befehl oder so? :D (Arbeite leider noch viel zu selten mit Java)
 

fexx

Aktives Mitglied

AW: Schwieriges Menü mit Javascript umsetzen?

also den bilderwechsel links könntest du per css mit einer body klasse lösen

Code:
<body class="heizung">
.heizung #divwodeinbilddrinist { ... }

<body class="solar">
.solar #divwodeinbilddrinist { ... }

mit der rundung ... da würde ich wohl auch mit klassen und ids arbeiten ;-)
 

owieortho

Aktives Mitglied

AW: Schwieriges Menü mit Javascript umsetzen?

Ich würde das schon serverseitig anlegen. Der linken Spalte eine id in Abhängigkeit von der Auswahl im Head-Menü geben und diese mit unterschiedlichen Hintergründen versehen.
Den li-tags in der linken Navigation gibst Du z. B. id="pos1"/"pos2"... diese kannst Du dann einzeln weter nach rechts rücken lassen und mit entsprechenden css-hovers ausstatten.

P.S.: Im Header-Menü solltest Du Network Marketing korrigieren

P.P.S.: Weil das Leben schön ist und man es geniessen soll, gründet man ein Dienstleistungsunternehmen??? Ich hoffe Ihr feilt auch noch an den Texten.

P.P.P.S.: Javascript und Java sind zwei sehr unterschiedliiche Sprachen
 
Zuletzt bearbeitet:

Pfohl

Nicht mehr ganz neu hier

AW: Schwieriges Menü mit Javascript umsetzen?

Ich würde das schon serverseitig anlegen. Der linken Spalte eine id in Abhängigkeit von der Auswahl im Head-Menü geben und diese mit unterschiedlichen Hintergründen versehen.
Den li-tags in der linken Navigation gibst Du z. B. id="pos1"/"pos2"... diese kannst Du dann einzeln weter nach rechts rücken lassen und mit entsprechenden css-hovers ausstatten.

Ok, das macht Sinn.
Wie schreibe ich das dann in dem Code?

1. Das jeweilige Untermenü:
Bspw. nennen ich die Spalten LeftColumnDienstleistungen, LeftColumnNetworkmarketing, etc. ,
baue innerhalb dieser in HTML jeweils das passenden Untermenü (bsp. submenuDienstleistungen) in Form einer Ul ein,
und formatiere die ul über CSS -> verschiebe die li-tags jeweils nach rechts.
Welchen Befehl verwende ich dann, um bei Klick auf Dienstleistungen automatisch die Linke Spalte mit dem Menü submenuDienstleistungen aufzurufen?

2. Die Bilder links:
Wie löse ich dieses Problem dann? Ich will zu jedem Punkt des Untermenüs ein eigenes Bild! :)
Das habe ich noch nicht ganz verstanden :( ...

P.S.:
Das Menü möchte ich grafisch machen, also mit Grafiken für die jeweiligen Punkt. Soll ich dann png's verwenden, die teilw. transparent sind?

P.S.: Im Header-Menü solltest Du Network Marketing korrigieren
Oh vielen Dank! :) Böser Fehler, den hätt ich glatt übersehen!

P.P.S.: Weil das Leben schön ist und man es geniessen soll, gründet man ein Dienstleistungsunternehmen??? Ich hoffe Ihr feilt auch noch an den Texten.
Who knows? - Ich werd mit ihm seine Texte auf jeden Fall noch mal durchgehen. Der Text ist einfach 1:1 von ihm übernommen :D

P.P.P.S.: Javascript und Java sind zwei sehr unterschiedliiche Sprachen[/QUOTE]
Stimmt :D ... War nur faul!


VIELEN DANK schon mal für euere Hilfe!
Ihr habt mir bereits sehr geholfen, bzgl. des Verständnisses wie ich die linke Spalte aufbauen soll :)

LG Andi
 

owieortho

Aktives Mitglied

AW: Schwieriges Menü mit Javascript umsetzen?

Welchen Befehl verwende ich dann, um bei Klick auf Dienstleistungen automatisch die Linke Spalte mit dem Menü submenuDienstleistungen aufzurufen?
Da Du ja auf dienstleistungsservice.php verlinkt hast, ist es nahe liegend, dass Du genau in dieser Datei dieses Submenu einträgst.

Wie löse ich dieses Problem dann? Ich will zu jedem Punkt des Untermenüs ein eigenes Bild!
Das hatte ich erst falsch verstanden. Da für diese Navigation noch kein Quelltext vorhanden ist, kann ich nur annehmen, dass Du diesen wahrscheinlich ähnlich wie die Header-Navigation aufbaust, also jeweils eigene Seiten aufrufst. In dem Fall könntest Du wieder die Einträge in der jeweiligeen Seite vornehmen.

Das Menü möchte ich grafisch machen, also mit Grafiken für die jeweiligen Punkt. Soll ich dann png's verwenden, die teilw. transparent sind?
Halte ich für die praktikabelste Lösung. Oder Du suchst mal nach Transparenz, Hover und CSS3.
 

Pfohl

Nicht mehr ganz neu hier

AW: Schwieriges Menü mit Javascript umsetzen?

Quelltext für die Sumenüs ist jetzt in der index.html vorhanden ;)
Vll. willst noch einmal einen Blick drauf werfen?

Hatte mir überlegt die 4 Submenüs in 4 extra php-Dateien zu legen und dann für jeden Unterpunkt der Submenüs eine php-Seite anzulegen.
In jede dieser binde ich dann neben Header und Footer auch das passende Submenü.
Bsp: solar.php mit header.php, submenu_dienstleistungen.php und footer.php eingebunden!
Guter Plan ? :D

ABER: Ich weiß noch nicht, was ich mit den wechselnden Bildern links des Menüs machen soll!!! :(
Noch jemand eine Idee? - Wäre euch sehr verbunden! :D
 

sokie

Mod | Web

AW: Schwieriges Menü mit Javascript umsetzen?

wann sollen die denn wechslen? beim hover? dann javascript.
wenn die beim Laden der jeweiligen Seite erst gewechselt werden, verstehe ich das problem nicht:
und dann für jeden Unterpunkt der Submenüs eine php-Seite anzulegen.
dann werden auch dort die regeln festgelegt, welches Bild geladen werden soll.
 

Pfohl

Nicht mehr ganz neu hier

AW: Schwieriges Menü mit Javascript umsetzen?

Bin derzeit noch am abwägen, welche Variante besser geeignet ist.

1. Wie würde ich das mit Javascript umsetzten? Gibt's da vordefinierte Befehle oder Scripts?

-> Folgefrage: Würde ich dann das komplette Submenü mit Javascript machen?

Wie lautet bei Javascript der Befehl, um beim Laden des Submenu einen bestimmten Menüpunkt als "aktiv" zu wählen?

Ist es eigentlich zwingend notwendig für jeden Menüpunkt eine eigene php.-Seite zu erstellen oder könnte man mit Javascript einen bestimmten Text / Content in die rechte Spalte laden, bei Klick auf einen Menüpunkt?

2. Variante: Scheint mir die einfachere, aber nicht so elegante Variante zu sein?

Wenn ich die Bilder immer mit der php.Datei laden lasse, soll ich diese dann als png. speichern und bei dem Bogen freistellen, so dass der Bereich transparent ist. - Die Bilder sollen sich ja nicht mit dem Menü überschneiden.

Oder die Bilder als gif. (mit angeschnittenem Bogen) in den Hintergrund legen und lediglich die Menübuttons darüber legen.

Sorry für die etwas blöde Frage. :D

& Vielen dank für eure Hilfe nochmal ;)
 

Pfohl

Nicht mehr ganz neu hier

AW: Schwieriges Menü mit Javascript umsetzen?

Sollen die Bilder eigentlich schon beim Hover wechseln oder erst beim Aufruf der verlinkten Seite?

Habe es mir jetzt noch mal durch den Kopf gehen lassen: JA, würde sie gerne beim Hover wechseln lassen! :)

Wüsstest du denn, wie sich das realisieren ließe? :uhm:

LG
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.158
Beiträge
2.581.880
Mitglieder
67.225
Neuestes Mitglied
Petra
Oben