Textlink - Farbe von links nach rechts ändern

[fr1000]

Hallo Community,
ich wende mich mit einem Problem an euch, welches vermutlich sehr simpel gelöst werden kann. Wahrscheinlich so simpel, dass ich zu kompliziert nach einer Lösung suche. (Vielleicht irre ich mich auch und es ist schwerer als ich denke. )
Folgendes Problem:
Ich habe ein Menü welches aus einer Liste besteht. Die vorhandenen Links sollen bei einem mouseover die Farbe ändern. Bis hier hin ists auch kein Problem und konnte ich auch umsetzen.

Hier mein Code dazu:


Jetzt kommt der schwierige (für mich zur Zeit leider unlösbare) Teil:
Ich möchte einen Effekt von links nach rechts haben. D. h. ich möchte dass der Link, bildlich gesprochen, mit Farbe "voll läuft".

Und genau dazu finde ich absolut keine Lösung. Ich kann mir jedoch auch nicht vorstellen, dass ich der erste mit so einem Wunsch bin. Eher im Gegenteil.... es ist bestimmt so einfach, dass keiner so eine Frage stellen muss.^^... Ich sage auch noch dazu: jQuery ist für mich noch sehr neu und ich lerne zur Zeit.
Ich hoffe ihr könnt mir helfen!

Vielen lieben Dank!
fr1000

 

[skiron]

Also ich denke so einen Effekt bekommt man nur mit Tricks hin. Ich würde mir eine Grafik anlegen mit transparentem Text. Hinter die Grafik würde ich dann ein Farbfeld von Links nach Rechts bewegen. Ich denke das würde sich mit CSS 3 machen lassen.

Hier ein Beispiel:

Alternativ müsstest Du für jeden Buchstaben ein einzelnes Element anlegen, das dann per Transition die Farbe ändert. Das wird dann aber kompliziert und ich glaube dann bekommst Du auch nicht diesen flüssigen Verlauf hin sondern nur den Farbwechsel der ganzen Buchstaben.