Mit Hilfe von html und Java-Sript ein Menu erstellen

  • Hallo Leute,


    ich bin gerade dabei, für einen Freund eine Homepage zu erstellen. Eigentlich ist auch fast alles fertig, doch mein Menü auf der linken Seite funktioniert noch nicht perfekt.
    Die Startseite besteht aus einer Tabelle. Dadurch erhalte ich links ein Menü, oben, rechts und unten jeweils ein Bild als Rahmen. Der eigentliche Inhalt befindet sich im mittleren Feld (innerhalb eines Frames). Klickt man links auf einen Button, öffnet sich die entsprechende Seite in der Mitte. Das funktioniert auch prima. Ich habe mir nur (dummerweise) in den Kopf gesetzt, dass die Buttons entsprechend zum Inhalt gesetzt bleiben sollen. Dazu werden mit Hilfe von Java-Skript die Bilder der Buttons ausgetauscht. Weiße Farbe bedeutet ausgewählt, der Rest ist blau. Das klappt auch, allerdings gibt es nun zwei Probleme:


    1.
    Beim Aktualisieren der Seite wird der Button des ersten Menüpunktes gesetzt, aber im Frame bleibt der alte Inhalt. Zwangläufig setzte ich dann bei onLoad auch den Inhalt mit zurück. Ist nicht schön, aber ist immerhin konsistent. Gibt es eine andere Möglichkeit?


    2.
    Wenn man im Browser in der History zurückgeht, wird der Button auch zurückgesetzt, allerdings bleibt der Inhalt im Frame erhalten. Hier weiß ich gar keine Lösung. Das ist nun überhaupt nicht konsistent. Ich muss irgendwo vermerken, welcher Button gedrückt sein soll.


    Gibt es eigentlich generell eine "richtige" Lösung zum Erstellen von Menüs?
    Ich habe gehört, dass man Frames nicht mehr unbedingt verwenden soll. Darum habe ich eine Tabelle für die Startseite gewählt. Dadurch kann ich ein festes Menü erstellen und meine Hintergrundbilder besser positionieren. Allerdings kann ich Tabelleninhalte nur direkt ansprechen, wenn ich iframe benutze, oder irre ich mich da?
    Oder ist es besser, wenn ich meine Tabelle auf jeder Seite benutze und immer die ganze Seite neu lade, zusammen mit dem geänderten Inhalt?
    Oder soll ich lieber alles mit php machen (was ich eigentlich noch nicht kann, aber auch lernen möchte). Oder lieber Flash?


    Ich bin momentan ein bisschen ratlos, weil ich die Seite wirklich gut machen möchte und ständig an irgendwelche Grenzen stoße, weil irgendwas nicht zusammenpasst oder nur unter Netscape oder Internet Explorer funktioniert (ich sage nur png und IE!).


    Vielen Dank.

  • Hi,


    auch wenn es für dich Mehrarbeit bedeutet, würde ich dir PHP nahelegen und raten, von Frames kompletten Abstand zu nehmen.


    Frames sind out und finden nur noch als "Dummy" ihren Platz.


    Kennst du dich mit JavaScript aus, ist der Weg zu PHP nicht sehr weit. Beide sind Scriptsprachen und beide haben eine ähnliche Syntax.


    Was bei JavaScript das 'var inhalt = "test";' ist, ist bei PHP '$inhalt = "test";'


    Der Vorteil beim Verwenden von einem Dokument ohne Frames mit PHP liegt auf der Hand.
    Du übergibst eine Variable per link, z.B. "?link=impressum"


    Nun kannst du, da du die Variable bereits im gesamten Dokument hast, eine simple Abfrage auf "$link" machen und das sowohl in der Navigation, als auch im Inhaltsbereich.
    Das schließt zwar mit ein, dass bei jedem Klick auf einen Menüpunkt auch die Seite neu geladen wird, aber das ist mittlerweile Starndard im Web.


    Von Flash würde ich die weitestgehend abraten.


    Ein Tipp noch:
    Wenn du die Frames und JavaScripts beibehalten willst, programmiere eine OnLoad-Function.
    In der Navigation verwendest du als Base-HREF den Navigationsframe und übergibst eine Variable, z.B. "?link=impressum".
    Nun Programmierst du die Navigation so, dass sie im Falle von "impressum" den Impressums-Button aktiv setzt und per onload-befehl den Target-Frame "Inhalt" neu lädtst -> und zwar mit impressum.html
    Die Targetangabe geschieht über die Framenamen, die du im Frameset gesetzt hast.


    Problem aber: deaktiviert jemand JavaScript, sieht er unter Umständen nicht einmal das Menü, was bei PHP nicht der Fall sein wird, da PHP, im Gegensatz zu JS, auf dem Server ausgeführt wird.


    Viele Grüße
    Chris

  • Hallo c.loechner,


    danke für die Tipps. Die Übergabe der Variablen werde ich nachher mal ausprobieren.


    Einen Nachteil gibt es bei php aber auch, nämlich dass Server mit php meistens teurer sind, oder sehe ich das falsch? Wenn man mit html und Java-Script auskommt, bekommt man teilweise für 2 Euro Webspace etc


    Gibt es bei php sonst noch Nachteile, oder bekommt man damit (fast) alles hin? Wenn man php benutzt, braucht man auch kein Java-Script mehr und kann auf Datenbanken zugreifen, oder?


    Warum ist von Flash abzuraten? Weil man ein Plug-In braucht?

  • Hi Cherry,


    Zitat

    Einen Nachteil gibt es bei php aber auch, nämlich dass Server mit php meistens teurer sind, oder sehe ich das falsch? Wenn man mit html und Java-Script auskommt, bekommt man teilweise für 2 Euro Webspace etc


    PHP-Unterstützung erhält man mittlerweile sogar zum Teil kostenlos. Hier müsstest du einfach mal die Provider abklappern ;)


    Zitat

    Gibt es bei php sonst noch Nachteile, oder bekommt man damit (fast) alles hin? Wenn man php benutzt, braucht man auch kein Java-Script mehr und kann auf Datenbanken zugreifen, oder?


    Mit PHP lässt sich weitestgehend alles bewältigen, was serverseitig ist, also auch problemlos auf Datenbanken zugreifen, etc. Willst du allerdings den Browser beeinflussen, z.B. mit "alert" oder "history.back()" kommst du um JavaScript nicht umhin.
    Die beste Möglichkeit ist eine gesunde Verbindung von beidem.
    Alles was sicher sein muss und serverseitig abgedeckt werden kann/muss - also auch der komplette Seitenaufbau, sollte mit PHP gesteuert werden. Nette Spielereien, die dem User dazu auch noch eine gute Hilfe sind, mit JavaScript.


    Zitat

    Warum ist von Flash abzuraten? Weil man ein Plug-In braucht?


    Flash ist ein zweischneidiges Schwert...


    Es ist toll anzusehen und bietet einige Funktionen, die anders schwer bis gar nicht umsetzbar sind. Bestens für Multimedia-Seiten und ähnliches geeignet.
    Bietet man aber eine Flashseite an und will niemanden aussperren, muss man eine HTML-Version anbieten, weil:
    -nicht jeder hat DSL
    -Flash wird wie ActiveX behandelt und ist dadurch auf vielen Rechnern nicht betrachtbar
    -Flash ist ein PlugIn, welches nicht jeder sein Eigen nennt/nennen kann


    Viele Grüße
    Chris

  • Hallo Chris,


    vielen Dank für die Erklärungen.


    Ich bekomme die Parameterübergabe irgendwie nicht hin.


    Ich habe folgendes im Internet gefunden:


    function Argumente()
    {
    var arg = new Array();
    var location = window.location.search;


    if (location.length > 0)
    {
    location = location.substr(1, location.length - 1);
    arg = location.split("&");
    }


    return arg;
    }


    Meine Funktion lautet:


    function reset() /*diese Funktion wird bei unload aufgerufen*/
    {


    var parameter = Argumente();


    document.images[0].src = "Bilder/home_aus.png";
    document.images[1].src = "Bilder/kaufen_aus.png";


    if(parameter[0]==home)
    {
    document.images[0].src = "Bilder/home_an.png";
    open("hauptHome.html?link=home","mainWindow");
    }
    else if(parameter[0]==kaufen)
    {
    document.images[1].src = "Bilder/kaufen_an.png";
    open("kaufenHaus.html?link=kaufen","mainWindow");
    }
    }


    und der Body:


    <body onLoad="reset()">


    ...

    <a href="hauptHome.html?link=home" target="mainWindow">
    <img class="menu" src="Bilder/home_an.png" id="home"
    alt="Home" height="33px" width="132px"
    onClick="BildWechsel(this)" border="0">
    </a>
    <a href="kaufenHaus.html?link=kaufen" target="mainWindow">
    <img class="menu" src="Bilder/kaufen_aus.png" id="kaufen"
    alt="Kaufen" height="33px" width="132px"
    onClick="BildWechsel(this)" border="0">
    </a>


    ...


    Das Problem ist, dass beim Laden nur die Seite index.html übertragen wird. Dort stehen ja keine Parameter drin.


    Kannst du mir das Ganze noch mal ausführlicher erklären?


    Vielen Dank,
    Cherry17

  • Hi,


    schicke mir bitte eine PN mit der URL der Seite, dann kann ich mir das Problem ansehen.


    Derzeit habe ich die Vermutung, dass die Funktion "Argumente" nicht genau das macht, was sie eigentlich machen soll.


    Viele Grüße
    Christian Löchner