hyperlink mit langsamem farbwechsel?

[heros]

gibt es eine möglichkeit, im dreamweaver hyperlinks zu machen, die bei mouseover ihre farbe nicht ruckartig, sondern langsam in eine andere farbe wechseln?
und kann man die geschwindigkeit des wechsels selber bestimmen?

das ganze müsste irgendwie in dreamweaver zu bewerkstelligen sein, da ich ziemlich unerfahren bin. ausser, mir kann jemand eine art anleitung liefern, wie und wo ich den code einfügen müsste.

danke für eure hilfe.

 

[Andreas Gaisbauer]

Hallo

Kopiere follgendes Skript in das HTML Dokument
(Bei DW MX: Einfügen -> Skriptobjekte -> Skript)

Aus Ladezeitgründen würde ich es aber eher extern einbinden...
-> Script in einen TextDatei kopieren
-> als dein_script.js speichern
-> im Head bereich der HTML Dateien mit

<script src="dein_script.js" type="text/javascript">
< / script>

einbinden - mehr infos dazu

Die Farben kannst du in den ersten beiden Skriptzeilen definieren
-> Einige Farben

Hier jetzt das Script

startColor = "#000099"; // initial link color
endColor = "#FF0000"; // final link color


stepIn = 25; // delay when fading in
stepOut = 25; // delay when fading out

autoFade = true;

sloppyClass = false;


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";

document.onmouseover = domouseover;
document.onmouseout = domouseout;

startColor = dehexize(startColor.toLowerCase());
endColor = dehexize(endColor.toLowerCase());

var fadeId = new Array();

function dehexize(Color){
var colorArr = new makearray(3);
for (i=1; i<7; i++){
for (j=0; j<16; j++){
if (Color.charAt(i) == hexa[j]){
if (i%2 !=0)
colorArr[Math.floor((i-1)/2)]=eval(j)*16;
else
colorArr[Math.floor((i-1)/2)]+=eval(j);
}
}
}
return colorArr;
}

function domouseover() {
if(document.all){
var srcElement = event.srcElement;
if ((srcElement.tagName == "A" && autoFade) || srcElement.className == "fade" || (sloppyClass && srcElement.className.indexOf("fade") != -1))
fade(startColor,endColor,srcElement.uniqueID,stepIn);
}
}

function domouseout() {
if (document.all){
var srcElement = event.srcElement;
if ((srcElement.tagName == "A" && autoFade) || srcElement.className == "fade" || (sloppyClass && srcElement.className.indexOf("fade") != -1))
fade(endColor,startColor,srcElement.uniqueID,stepOut);
}
}

function makearray(n) {
this.length = n;
for(var i = 1; i <= n; i++)
this[i] = 0;
return this;
}

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 setColor(r, g, b, element) {
var hr = hex(r); var hg = hex(g); var hb = hex(b);
element.style.color = "#"+hr+hg+hb;
}

function fade(s,e, element,step){
var sr = s[0]; var sg = s[1]; var sb = s[2];
var er = e[0]; var eg = e[1]; var eb = e[2];

if (fadeId[0] != null && fade[0] != element){
setColor(sr,sg,sb,eval(fadeId[0]));
var i = 1;
while(i < fadeId.length){
clearTimeout(fadeId[i]);
i++;
}
}

for(var i = 0; i <= step; i++) {
fadeId[i+1] = setTimeout("setColor(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);
}
fadeId[0] = element;
}

gefunden hab ich das ganze bei DrWeb




CU Andreas
-------------------------------------------------------------
"There are only 10 types of people in the world, those that understand binary, and those that don't."

 

[heros]

danke vielmals, crono. hat auf anhieb geklappt.

 

[Andreas Gaisbauer]

nix zu danken - gerngeschehen

 

[Christoph]

die andere Möglichkeit wäre ein Mouseoer Effekt mit 2 Bildern,

wobei das 2 ein animiertes Gif ist das den jeweiligen Effekt hat

 

[Daniel Mannheimer]

wäre aber nicht grad die feine englische

 

[Andreas Gaisbauer]

die andere Möglichkeit wäre ein Mouseoer Effekt mit 2 Bildern,

wobei das 2 ein animiertes Gif ist das den jeweiligen Effekt hat

das hatte ich mal ausprobiert -kein Witz- wurde aber nicht richtig dargestellt bzw von der Animation war nix zu sehen

 

[winterchen]

ich bevorzuge die 2. möglichkeit!

 

[winterchen]

oder doch die erste? *gg*

 

[Sirjoga]

Nix geht!!

Bei mir klappt es nicht benötigt man dafür php auf dem webspace . ich glaube nicht oder ??

also ich habe datei .js erstellt und diese dann wie vorgeschrieben im header verknüpft !!

doch es funtioniert nicht !!

liegt es daran das ich die links schon mit einer .css datei verändert habe (also ich habe .css datei, die auch die hyperlinks verändert hat)!!


dann versuchte ich es indem ich die Verknüpfung zur .css datei entfernt habe doch es ging trotzdem nicht !!!