Søg
Avatar billede jammerlab Nybegynder
09. november 2003 - 16:35 Der er 21 kommentarer og
1 løsning

onmouse farve skift med 3 farver?

Kan man? :) Jeg har lavet med mouseover så den skifter fre en farve til en anden... men kan man lave så den er hvid og når man så holder musen overså blir den orange og hvid igen lige efter.. altså 3 farver :)
Avatar billede fixxxer Nybegynder
09. november 2003 - 16:42 #1
det skal gøres med noget javascipt:

<head>
<script>
var ns, ns6, ie, newlayer, oldlayer;

ns4  = (document.layers) ? true : false;
ie4 = (document.all)? true:false
ie5 =(document.getElementById)? true:false
ns6 = (document.getElementById && !document.all)?true:false;

function getLayerStyle( lyr ){
if( ns4 ){
return document.layers[lyr];
} else if( ie4 ){
return document.all[lyr].style;
} else if( ie5 ){
return document.all[lyr].style;
} else if( ns6 ){
return document.getElementById(lyr).style;
}
}

function onHover(varlink){
  getLayerStyle(varlink).color = '#F8BF24'; //ændre farven første til orange
  setTimeout("getLayerStyle(varlink).color = '#F8BF24';", 1000); //vent 1 sekundet og skift til hvid
}
</script>
</head>

<body>
  <a id="mitlink" href="tralala.htm" onmouseover="onHover('mitlink');">dur det?</a>
</body>
Avatar billede jammerlab Nybegynder
09. november 2003 - 16:45 #2
Nopz :P

'Varlink ikke deffineret'
Avatar billede fixxxer Nybegynder
09. november 2003 - 16:48 #3
ja det fandt jeg ud af, jeg skrev bare løst af, jeg laver lige et fungerende eks.
Avatar billede fixxxer Nybegynder
09. november 2003 - 16:51 #4
<html>

<head>
<script>
var ns, ns6, ie, newlayer, oldlayer;

ns4  = (document.layers) ? true : false;
ie4 = (document.all)? true:false
ie5 =(document.getElementById)? true:false
ns6 = (document.getElementById && !document.all)?true:false;

function getLayerStyle( lyr ){
if( ns4 ){
return document.layers[lyr];
} else if( ie4 ){
return document.all[lyr].style;
} else if( ie5 ){
return document.all[lyr].style;
} else if( ns6 ){
return document.getElementById(lyr).style;
}
}

function onHover(varlink){
  getLayerStyle(varlink).color = '#F8BF24'; //ændre farven første til orange
  setTimeout("waitHover('" + varlink + "');", 1000); //vent 1 sekundet
}

function waitHover(Flink){
  getLayerStyle(Flink).color = '#FFFFFF'; //skift farven til hvid
}
</script>
</head>

<body>
  <a id="mitlink" href="tralala.htm" onmouseover="onHover('mitlink');">dur det?</a>
</body>

</html>
Avatar billede jammerlab Nybegynder
09. november 2003 - 16:53 #5
Arhg ja det fungere, men det er ikke helt det jeg havde i tankerne :P Det var mere sådan en animeret overgang mellem farverne jeg tænkte på... nogen du kender til?
Avatar billede fixxxer Nybegynder
09. november 2003 - 16:54 #6
altså fading ? :)
Avatar billede jammerlab Nybegynder
09. november 2003 - 16:54 #7
Det lyder rigtigt hehe... det fungere som det skal nu altså den skifter mellem farverne... men ja hvis jeg gerne vil havde den til at fade mellem farverne... hvordan gør vi så det?
Avatar billede fixxxer Nybegynder
09. november 2003 - 16:59 #8
så er det jo sådan set bare af lave onHover lidt om, sådan den har fx 5 "broer" over i en ny farve noget ala:

<html>

<head>
<script>
var ns, ns6, ie, newlayer, oldlayer;

ns4  = (document.layers) ? true : false;
ie4 = (document.all)? true:false
ie5 =(document.getElementById)? true:false
ns6 = (document.getElementById && !document.all)?true:false;

function getLayerStyle( lyr ){
if( ns4 ){
return document.layers[lyr];
} else if( ie4 ){
return document.all[lyr].style;
} else if( ie5 ){
return document.all[lyr].style;
} else if( ns6 ){
return document.getElementById(lyr).style;
}
}

function onHover(varlink){
  getLayerStyle(varlink).color = '#F8BF24'; //ændre farven første til orange
  setTimeout("getLayerStyle('" + varlink + "').color = '#F9D161';", 100);
  setTimeout("getLayerStyle('" + varlink + "').color = '#FADD8A';", 200);
  setTimeout("getLayerStyle('" + varlink + "').color = '#FBE6AA';", 300);
  setTimeout("getLayerStyle('" + varlink + "').color = '#FDEFCA';", 400);
  setTimeout("getLayerStyle('" + varlink + "').color = '#FEFBF3';", 500);
}
</script>
</head>

<body>
  <a id="mitlink" href="tralala.htm" onmouseover="onHover('mitlink');">dur det?</a>
</body>

</html>
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:00 #9
for at finde ud af "mellemfarverne" kan du bruge et grafikprogram og laver en gradient-fyld på og så tag farvene så der bliver en pæn overgang, fx med Paint Shop Pro
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:01 #10
som jeg har gjort her: http://download.easysoftinc.dk/overgang.jpg
Avatar billede jammerlab Nybegynder
09. november 2003 - 17:01 #11
aahhh I see... smart! :) Kan vi smide den på en TD istedet for text?
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:02 #12
jo sagtens :)
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:02 #13
men så er det jo nok background-color, du vil rode med korrekt?
Avatar billede jammerlab Nybegynder
09. november 2003 - 17:03 #14
jep
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:03 #15
så skal onHover se sådan her ud:

function onHover(varlink){
  getLayerStyle(varlink).color = '#F8BF24'; //ændre farven første til orange
  setTimeout("getLayerStyle('" + varlink + "').backgroundColor = '#F9D161';", 100);
  setTimeout("getLayerStyle('" + varlink + "').backgroundColor = '#FADD8A';", 200);
  setTimeout("getLayerStyle('" + varlink + "').backgroundColor = '#FBE6AA';", 300);
  setTimeout("getLayerStyle('" + varlink + "').backgroundColor = '#FDEFCA';", 400);
  setTimeout("getLayerStyle('" + varlink + "').backgroundColor = '#FEFBF3';", 500);
}
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:04 #16
der var lige sniget sig en fejl ind i første linje:

getLayerStyle(varlink).backgroundColor = '#F8BF24'; //ændre farven første til orange
Avatar billede jammerlab Nybegynder
09. november 2003 - 17:06 #17
Smukt mester ! :D Det er du sq ikke helt værst til de point er så meget dine!

Tak for hjælpen.
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:08 #18
tak for point, held og lykke med projektet
Avatar billede jammerlab Nybegynder
09. november 2003 - 17:10 #19
Hov hehe 2.sek :D Inden du smutter... nu kan jeg jo ikke deffinere flere td'er pga det har samme navn... skal jeg så bare deffinere flere af functioner?

function onHover(varlink){
function onHover(varlink2){
function onHover(varlink3){

... ser ikke ud til at fungere...
Avatar billede jammerlab Nybegynder
09. november 2003 - 17:13 #20
okay weird... det fungere nu.
Avatar billede fixxxer Nybegynder
09. november 2003 - 17:17 #21
du ændre kun din tr (her et link, gider ikke skrive et om)

<a id="mitlink1" href="tralala.htm" onmouseover="onHover('mitlink1');">dur det?</a>

<a id="mitlink2" href="tralala.htm" onmouseover="onHover('mitlink2');">dur det?</a>

osv.
Avatar billede jammerlab Nybegynder
09. november 2003 - 17:17 #22
jep netop... sådan jeg også opdagede det :) tak endnu engang.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 13:47 Dette er ikke en kommerciel session i Windows 11 Af eksmojo i Windows
31/0810:26 Synkronisering af kalender mellem computer, android telefon og iPhone Af Strawberry i Andre onlineløsninger
31/0810:24 Kan Excel selv beregne alder? Af leahcim i Excel
30/0815:02 Gemme besked fra Facebook / Messenger Af lurup i Sociale medier
29/0820:17 Kan man kopiere en DVD og afspille den på * Linux Mint - Cinnamon - 22.1 - "Xia" * ? Af Ikke-ekspert i Linux
White papers
Flere white papers »