Link Textfarbe langsam ändern
Andre
- css
0 Kai Lahmann0 Andre0 Markus0 Andre
0 Kai Lahmann
0 Spence Robert E.0 Andre0 Kai Lahmann
Ich habe da mal eine Frage. Wenn ich einen Link (zB schwarze Schrift) habe und wenn ich mit der Maus rübergehe, will ich, dass er die Farbe LANGSAM zu rot wechselt. Dann entsteht so ein kleiner schöner Effekt. Bitte aber kein CSS, wenn es keine Möglichkeit gibt. Am besten wäre es wenn, man den Code in <font Befehl> eingeben könnte. Und wenn es kompliziert wird, bitte gut beschreiben. danke
hi
Ich habe da mal eine Frage. Wenn ich einen Link (zB schwarze Schrift) habe und wenn ich mit der Maus rübergehe, will ich, dass er die Farbe LANGSAM zu rot wechselt. Dann entsteht so ein kleiner schöner Effekt. Bitte aber kein CSS, wenn es keine Möglichkeit gibt. Am besten wäre es wenn, man den Code in <font Befehl> eingeben könnte. Und wenn es kompliziert wird, bitte gut beschreiben. danke
was du da brauchst ist JavaScript (JS) und eine Schleife, die das ganze regelmäßg etwas weiter Richtung rot setzt.
Grüße aus Bleckede
Kai
gut und woher bekomme ich das her? url? beispiele? code?
gibts auf jswelt.de
gibts auf jswelt.de
wo da? habe schon gesucht. kannst du mir weiter helfen?
hi
gut und woher bekomme ich das her? url? beispiele? code?
www.gethtml.de - ach das gibt's noch - naja, dann....
Grüße aus Bleckede
Kai
Hallo Kai
ich denke du suchst dieses Script hier:
aufruf mit:
<a class="fade" name="Link1" target="_blank" href="http://blabla.htm">bla bla</a>
bei jedem Link muss der name angepasst werden (z.b. link2 link3 link4 usw...)
Die Farben und Schrittwerte musst du noch anpassen:
fade(r1,g1,b1, r2,g2,b3, schritte, hell-dunke oder dunkel-hell, element);
Gruss
Robert
// Link - Softfader
n=document.layers
ie=document.all
function hideIt(){
if(ie || n){
if(n) document.divLoadCont.visibility="hidden"
else divLoadCont.style.visibility="hidden"
}
}
// Fading Links
document.onmouseover = domouseover;
document.onmouseout = domouseout;
function domouseover() {
if(document.all){
srcElement = window.event.srcElement;
if (srcElement.className.indexOf("fade") > -1) {
var linkName = srcElement.name;
fadein(linkName);
}
}
}
function domouseout() {
if (document.all){
srcElement = window.event.srcElement;
if (srcElement.className.indexOf("fade") > -1) {
var linkName = srcElement.name;
fadeout(linkName);
}
}
}
function makearray(n) {
this.length = n;
for(var i = 1; i <= n; i++)
this[i] = 0;
return this;
}
hexa = new makearray(16);
for(var i = 0; i < 10; i++)
hexa[i] = i;
hexa[10]="a"; hexa[11]="b"; hexa[12]="c";
hexa[13]="d"; hexa[14]="e"; hexa[15]="f";
function hex(i) {
if (i < 0)
return "00";
else if (i > 255)
return "ff";
else
return "" + hexa[Math.floor(i/16)] + hexa[i%16];}
function setbgColor(r, g, b, element) {
var hr = hex(r); var hg = hex(g); var hb = hex(b);
element.style.color = "#"+hr+hg+hb;
}
function fade(sr, sg, sb, er, eg, eb, step, direction, element){
for(var i = 0; i <= step; i++) {
setTimeout("setbgColor(Math.floor(" +sr+ " *(( " +step+ " - " +i+ " )/ " +step+ " ) + " +er+ " * (" +i+ "/" +step+ ")),Math.floor(" +sg+ " * (( " +step+ " - " +i+ " )/ " +step+ " ) + " +eg+ " * (" +i+ "/" +step+ ")),Math.floor(" +sb+ " * ((" +step+ "-" +i+ ")/" +step+ ") + " +eb+ " * (" +i+ "/" +step+ ")),"+element+");",i*step);
}
}
function fadeout(element) {
fade(217,246,234, 148,170,160, 30, 1, element);
}
function fadein(element) {
fade(169,183,178, 244,252,249, 12, 1, element);
}
Hallo Kai
ich denke du suchst dieses Script hier:
aufruf mit:
<a class="fade" name="Link1" target="_blank" href="http://blabla.htm">bla bla</a>
bei jedem Link muss der name angepasst werden (z.b. link2 link3 link4 usw...)
Die Farben und Schrittwerte musst du noch anpassen:
fade(r1,g1,b1, r2,g2,b3, schritte, hell-dunke oder dunkel-hell, element);
---------------------
wo soll ich das unten in script verändern? ->
fade(r1,g1,b1, r2,g2,b3, schritte, hell-dunke oder dunkel-hell, element);
---------------------
wie fängt an und endet das script? und wo muss ich es einfügen?
---------------------
was cih bisher gewunden habe, war nur ein Text der sich automatisch ändert. Ich will aber einen Link der bei rüberfahren mit der Maus erst die Farbe ändert. puhh
also ich habe dieses Script in einer ausgelagerten !fade.js Datei..
aufrufen tue ich es in der Html Datei mit :
<script language="JavaScript" src="!fade.js"></script>
es fängt bei
// Link -Softfader
und endet bei
}
:-) (spass muss sein)
die Werte änderst du am Ende des Scripts
->
function fadeout(element) {
fade(217,246,234, 148,170,160, 30, 1, element);
}
function fadein(element) {
fade(169,183,178, 244,252,249, 12, 1, element);
}
bei beiden Fade's (fadein / fadeout):
die ersten 3 Zahlenwerte stehen für die Anfangsfarbe R, G, B
die nächsten 3 Zahlenwerte für die Endfarbe R, G, B
30 ist die Schrittgeschwindigkeit in der der Fader läuft
1 ist die Richtung der Farbabstufungen
element steht für das "Link1" im Html Code....
Gruss
Robert
DANKE THX HAT GEKLAPPT, DU BIST DER BESTE :)
hi
DANKE THX HAT GEKLAPPT, DU BIST DER BESTE :)
..freu' dich nicht zu früh - schmeiß mal was anderes als MSIE an! (und ich meine nicht NN4 wo eh nix funzt)
Grüße aus Bleckede
Kai
hi....
unter NN6 läufts wieder :-)
(musst halt umsteigen auf NN6 -> der neue NN läuft im Gegensatz zu NN4 stabiler [zumindestens bei mir])
grz....
Robert
hi
du opferst mal wieder unnötig jede Kompatibilität.
<a href="" onmouseover="red();" onmouseout="black();">
und im Script:
function red(){
for(i=0;i<255;i++){
setTimeout("reddo(i)",10);
}
fonction reddo(){
this.style.color = "rgb("+i+",0,0)";
}
Das ganze zählt jetzt den rot-Wert alle 0,01sec um 1 hoch, so dass er nach 0,255sec auf #FF0000 steht. - reicht?
...und für die andere Richtung genauso, da dann nur eben ein i-- in der for-Schleife. Durch das "this." ist das mit dem Ansprechen des Elementes eben keine MSIE4-Syntax, sondern wird sowohl von dem, wie auch von heutigen Browsern verstanden.
NIEMALS document.all alleine! Das ist Technik von 1997 und ist heute mega out.
Grüße aus Bleckede
Kai