[dayscott]

ich möchte ein Css menü link beim drüberfahren langsam grün werden lassen.d.h. mit einer verzögerung -

die vorlage seht ihr hier: Blumen - Floristin München

wie man jetzt sehen kann hat das menü schonene "hover" effekt aber keinen "schleichenden" hover effekt - den ich gern hätte.

mir ist klar das ich dafür den event handler onmousover und onmousout brauche (letzeres da ich es wieder langsam heller werden lassen will) - jedoch scheitere ich an der umsetzung da ich ja ein .png für das backgroundbild im menü verwende und ich nicht weis wie der javacript code aussehen muss um entsprechenden effekt zu ermöglichen.

bin ein javascript neuling

[Rico]

Was du suchst heisst FADE IN / OUT. Mit googleln findest du jede Menge Einträge. "Fade Javascript" oder "Fade Menu".

Ein Script das dir ev. helfen könnte ist JavaScript von Walter Zorn - Tooltips per JavaScript / DHTML. Es lässt sich auf JEDES HTML-Tag anwenden und kennt auch Fade in/out. Ich benutze es selber auch, jedoch ohne den Fade-Effekt.

Gruss Erich

[dayscott]

ja du benutzt den tooltip ,aber ich weis grad nich wie ich das "auf jeden html element" anwenden soll.


bitte um Hilfe.


sonst hab ich über google nix brauchbares (kostenfreies) gefunden.

[Rico]

Vielleicht war meine Idee aus dem Bauch heraus nicht gut. Meine Überlegung war, dass du quasi das Menu selbst als einen Tooltip über das Menu legst Parameter FIX). Ob das geht weiss ich nicht.

Aber schau dir mal das Script - Image Fade Menu - Menu Examples an. Es könnte deinen Vorstellungen schon sehr nahe kommen.

Gruss
Erich

[Sparta8]

Eine Navigation per Java halte ich für keine gute Idee.
Benutze doch einfach die Script Bibliothek von mootools.
MooTools - home

Damit kannst du jede CSS Eigenschaft beliebig mit JavaScript ändern. Langsam oder schnell wie du möchtest. Hier ein Beispiel:
MooTools Demos: Mouseenter

Wenn du ein Hintergrundbild verwendest und kein CSS, kannst du dieses auch langsam einblenden lassen.

Darüber hinaus bietet die Bibliothek die Events "mouseenter" und "mouseleave" welche viel besser funktionieren als OnMouseover und OnMouseout.

[cybaer]

Zitat von dayscott

wie man jetzt sehen kann hat das menü schonene "hover" effekt aber keinen "schleichenden" hover effekt - den ich gern hätte.

1. Menüeintrag ohne Hintergrund über ein leeres Element plazieren (position/z-index).
2. Im MouseOver dem leeren Element die gewünschte Hintergrundfarbe bei gleichzeitig vollständiger Transparenz zuweisen.
3. Mittels Interrupt die Transparenz schrittweise auschalten.