Rollover-Aufplopp-Navigations-Box-Dingsi...

  • Ähem, nach diesem aussagekräftigen Threadtitel, will ich doch mal genauer erklären, worum es geht:


    Ein Kunde möchte auf seiner Seite eine Box mit Reitern haben. Wenn man über diese Reiter fährt, soll sich dann der Inhalt der Box entsprechend ändern, nach dem selben Prinzip wie bei http://www.msn.com.
    Ich nehme mal stark an, dass man das irgendwie mit Javascript lösen kann. Weiß jemand von euch vielleicht, wie?

  • Frag mal TheWingedShadow.


    Die hat solche Menus für meine Website gebastelt, und das ganz ohne JavaScript

    Selbst wenn man sagt dass man außerhalb von Schubladen denkt, bestimmen immer noch die Schubladen das Denken. Erst wenn man sich bewusst ist dass die Schublade selbst nicht existiert kann man wirklich Neues erfinden


    INDEX DER THREADS ZU LHANND

  • Irgendwie ist deine Angabe zu ungenau...


    Aber anhand der Seite wars (fast) ersichtlich:


    Falls du ein Drop-Down-Menü meinst (CSS), da brauchst du nur unter dem Namen Drop down Menu CSS googeln. Es gibt da MASSIG Codebeispiele, vom blutigen Anfänger bis zum versierten Profi. Da wirste sicher fündig.


    Oder meinst du Registerkartige Darstellung?
    Da wäre vielleicht das etwas für dich: http://labs.silverorange.com/archive/2004/may/updatedsimple

  • Ja, im Prinzip genau so, aber da soll sich schon beim rollover der Inhalt des großen Kastens unten ändern und nicht erst beim Klick.

  • Mit JavaScript geht das recht einfach mit dem onMouseOver-Effekt. Beispiel:



    In obenstehendem Beispiel wird das ursprünglich angezeigte Bild beim Überfahren mit dem Mauszeiger durch ein anderes Bild ersetzt.


    Das ist natürlich alles andere als valide, schön, oder mit allen Browsern kompatibel.

  • Wenn jetzt noch nach dem Rausrollen das zuletzt angezeigte Inhaltsfenster stehen bleiben würde, dann wärs perfekt. :nick:


    Morgen muss es geschehen. Mal sehen, wie ich mir das alles zu meine Zwecke zurecht zupfen kann.

  • Also ich habe experimentiert, aber mit rein CSS ist das nicht bewerkstelligbar - nur wenn man den Tab anklicken müsste. Vielleicht wäre es ja okay durch den Hover-Effekt es voranzuzeigen und durch anklicken die Anzeige zu festigen. Aber das wäre womöglich für Besucher verwirrend.

  • Also das geht definitiv rein mit css, das hat TWS nämlich für mich gemacht... siehe hier


    Wie genau sie das gemacht hat, frag mich nicht... es gibt aber offensichtlich templates für sowas zum runterladen, man muss sie nur noch einbinden

    Selbst wenn man sagt dass man außerhalb von Schubladen denkt, bestimmen immer noch die Schubladen das Denken. Erst wenn man sich bewusst ist dass die Schublade selbst nicht existiert kann man wirklich Neues erfinden


    INDEX DER THREADS ZU LHANND

  • Du meinst aber jetzt vermutlich nicht das Letztgenannte, nämlich, dass der Mouseover auch stehen bleiben soll, wenn man mit der Maus den Bereich wieder verlässt, denn das tut er ja nicht in deiner Seite. Auch wenn ich die Navi sehr schick finde ;)

  • Echt? Soll da jetzt irgendwas aufpoppen, wenn man über die Menüpunkte fährt? Oder gehts nur um das Rotfärben? Ansonsten tut sich da nämlich nix

  • Also funktionieren tut es, aber festhängen bleibt der Inhalt nicht - sofern man die Inhaltsbox verlässt. Allerdings hab' ich auch grad wie meine Vorposter Probleme, welche Funktion du genau meinst.


    Also IE hat grundsätzlich Probleme, da er Pseudoklassen :hover usw. eigentlich nur auf Links (und scheinbar wenigen Elementen) interpretieren kann, obwohl es auf alle anwendbar sein soll. Daher gehts bei dem nicht so gut.

  • Ja, dass es beim Rauffahren stehen bleibt, ist ja anscheinend nicht möglich... :seufz:


    Und das komische ist, dass dieser Kasten für sich alleine in allen Browsern gut aussieht und die hover-Effekte funktionieren, wenn ich ihn in die Seite einbaue, dann aber auf einmal nicht mehr. Ich werde jetzt den Rest der Seite mal um diesen Kasten herumbauen, um herauszufinden, welche CSS-Definitionen sich nicht mit diesem Kasten vertragen... :arbeit:

  • Hm... Ganz ehrlich?


    Ich würd's mit jQuery oder Artverwandten umsetzen. Rein CSS macht zwar Spaß, aber da ~99% aller Browser eh JS aktiv haben und man sich grundsätzlich die Unterstützung für den IE6 sparen kann...


    Nur nicht hauen ;o)

Jetzt mitmachen!

Du hast noch kein Benutzerkonto auf unserer Seite? Registriere dich kostenlos und nimm an unserer Community teil!