mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Do 25.04.2024 09:18 Benutzername: Passwort: Auto-Login

Thema: [JS/CSS] CSS-Hover mit JS animieren? vom 20.10.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> [JS/CSS] CSS-Hover mit JS animieren?
Seite: 1, 2  Weiter
Autor Nachricht
Smooth-Graphics
Threadersteller

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 20.10.2008 22:26
Titel

[JS/CSS] CSS-Hover mit JS animieren?

 Antworten mit Zitat Zum Seitenanfang
Hey ihr,


kann man mit JS ein CSS-Hover animieren? Ich möchte das Hover einfach nur langsam einfaden lassen und ausfaden lassen, dafür aber keinen extra JS (mit css redunanten) code verwenden.

Tipps, lösungsvorschläge willkommen...

Smooth
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
xBe

Dabei seit: 04.06.2006
Ort: Mönchengladbach
Alter: 34
Geschlecht: Männlich
Verfasst Mo 20.10.2008 22:30
Titel

Antworten mit Zitat Zum Seitenanfang
ich habe nun sowas gefunden, ist das das was du suchst?

fade in an out
  View user's profile Private Nachricht senden
Anzeige
Anzeige
status4

Dabei seit: 01.10.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 20.10.2008 22:42
Titel

Antworten mit Zitat Zum Seitenanfang
Verstehe ich es richtig dass du von einer zur anderen CSS Eigenschaften morphen möchtest?

Um welche Eigenschaften geht es denn?

Zuletzt bearbeitet von status4 am Mo 20.10.2008 22:43, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Smooth-Graphics
Threadersteller

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 20.10.2008 22:49
Titel

Antworten mit Zitat Zum Seitenanfang
status4 hat geschrieben:
Verstehe ich es richtig dass du von einer zur anderen CSS Eigenschaften morphen möchtest?

Um welche Eigenschaften geht es denn?


Es geht darum ein Menühover zu animieren, also im Endeffekt von div#menu li{} aus div#menu li:hover{} z.B. zu faden.
:hover hat dabei eine andere background-color die soll eingeblendet werden (js) nicht nur überlagert werden(css).

Am besten wäre eine Möglichkeit mit JS-Bibliotheken wie mootools, Frameworks gehen auch. Einfach mal posten.
Konnte bisher getrost auf sonen Kram verzichten, nun brauch ichs halt doch mal. Auch wenns mir nicht gefällt.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
status4

Dabei seit: 01.10.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 20.10.2008 22:52
Titel

Antworten mit Zitat Zum Seitenanfang
Wenn du nicht sowieso schon ein Framework im Einsatz hast, spricht nichts dafür jetzt eins nur für
eine Animation einzusetzen. http://hesido.com/web.php?page=javascriptanimation

Falls du doch eines einsetzen möchtest:

http://demos.mootools.net/Effects

Zuletzt bearbeitet von status4 am Mo 20.10.2008 22:53, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Smooth-Graphics
Threadersteller

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mo 20.10.2008 23:01
Titel

Antworten mit Zitat Zum Seitenanfang
status4 hat geschrieben:
Wenn du nicht sowieso schon ein Framework im Einsatz hast, spricht nichts dafür jetzt eins nur für
eine Animation einzusetzen. http://hesido.com/web.php?page=javascriptanimation

Falls du doch eines einsetzen möchtest:

http://demos.mootools.net/Effects


Danke dir, das erste ist schon gut. Ich denke aber, dass mootools eh noch benötigt wird, von dem her muss ich mich mal da einarbeiten. (Wieso ist der Code mit Anltiung eigtl nicht mehr auf der Webseite direkt * grmbl * )

Danke!
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
xBe

Dabei seit: 04.06.2006
Ort: Mönchengladbach
Alter: 34
Geschlecht: Männlich
Verfasst Mo 20.10.2008 23:43
Titel

Antworten mit Zitat Zum Seitenanfang
Smooth-Graphics hat geschrieben:
status4 hat geschrieben:
Wenn du nicht sowieso schon ein Framework im Einsatz hast, spricht nichts dafür jetzt eins nur für
eine Animation einzusetzen. http://hesido.com/web.php?page=javascriptanimation

Falls du doch eines einsetzen möchtest:

http://demos.mootools.net/Effects


Danke dir, das erste ist schon gut. Ich denke aber, dass mootools eh noch benötigt wird, von dem her muss ich mich mal da einarbeiten. (Wieso ist der Code mit Anltiung eigtl nicht mehr auf der Webseite direkt * grmbl * )

Danke!



klick mal auf 1.1 da skommst du zum alten design, da steht alles noch Lächel
  View user's profile Private Nachricht senden
status4

Dabei seit: 01.10.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mo 20.10.2008 23:48
Titel

Antworten mit Zitat Zum Seitenanfang
xBe hat geschrieben:
klick mal auf 1.1 da skommst du zum alten design, da steht alles noch Lächel


Da hat sich aber einiges geändert. Aber es ist wirklich keine schwere Sache.

Code:
$('DasElementWelchesSichVerändernSoll').morph('#einSelector.foobar);



Hier findest du Beispiele:

http://www.mootorial.com/wiki/mootorial/06-fx/02-fx.morph

Zuletzt bearbeitet von status4 am Mo 20.10.2008 23:49, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen hover-Button/hover-Bild wird darunter eingefügt
Buttonreihe animieren
Mauszeiger animieren
Tabnavigation animieren
Bild animieren???
gifs animieren
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB