Søg
Avatar billede gadebarnet Nybegynder
13. marts 2005 - 13:59 Der er 8 kommentarer

baggrund farve fade

Hvordan laver jeg så min baggrund fader fra

#000000
til
#ffffff


Jeg har før lavet det, men kan sku ikke finde det...
Avatar billede roenving Novice
13. marts 2005 - 14:05 #1
Måske overkill, men fuldt funktionel uanset start- og slut-værdier:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>

<title>Skift baggrund</title>

<meta name="Generator" content="Stone's WebWriter 4">
<meta name="keywords" content="roenving,http://www.eksperten.dk/spm/599682">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript" type="text/javascript">
var strt = "7AA067",slut = "FA7AB0",interval = 10;
var st,sl,act = total = timer = 0;
function setBG(){
  document.body.style.backgroundColor = "#" + strt;
}
function skiftBG(tim){
  st = retRGB(strt);
  sl = retRGB(slut);
  if(!st||!sl)return;
  if(!tim.match(/^\d*(\.\d+)?$/))return;
  total = Math.floor(+tim*1000);
  timer = setInterval('chgBG()',interval);
  document.body.style.backgroundColor = "#" + strt;
  alert(total);
}
function chgBG(){
  act += interval;
  if(act>=total){
    document.body.style.backgroundColor = "#" + slut;
    clearInterval(timer);
    act = total = timer = 0;
    return;
  }
  var rgb = new Array();
  for(i=0;3>i;i++){
    rgb[i] = st[i] + Math.round((sl[i]-st[i])*act/total);
  }
  document.body.style.backgroundColor = 'rgb('+rgb[0]+','+rgb[1]+','+rgb[2]+')';
}
function retRGB(txt){
  txt = txt.split("");
  if(txt.length==3){
    txt[5] = txt[4] = txt[2];
    txt[3] = txt[2] = txt[1];
    txt[1] = txt[0];
  }else if(txt.length!=6)return null;
  var rgb = new Array();
  for(i=0;3>i;i++){
    rgb[i] = 16 * parseInt(txt[2*i],16) + parseInt(txt[2*i+1],16)
  }
  return rgb;
}
</script>

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

</head>

<body onload="setBG();">
<form id="minForm" name="minForm">
Sæt tid, som skiftet skal tage: <input id="minInput" name="minInput" type="text" value="Tom" onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;" size="20">
<br><button onclick="skiftBG(this.form.minInput.value)">Skift baggrund</button>
</form>
</body>

</html>
Avatar billede gadebarnet Nybegynder
13. marts 2005 - 14:14 #2
Ja, det må man sige...

Sidst jeg lavede det var det med noget style?

Kan sku ikke huske hvad det hed...
Avatar billede gadebarnet Nybegynder
13. marts 2005 - 14:27 #3
Jeg fandt det i mine backup's (og der er meget lort)

style='FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#bddef1,endColorStr=#ffffff);'

Vil du have point for forsøget, eller kan vi dele ?
Avatar billede roenving Novice
13. marts 2005 - 14:32 #4
-- og som det tydeligt fremgår er det en IE-only løsning ...

-- min virker i de browsere, jeg selv har, hvis man lige udkommenterer alerten og sætter return false; på button onclick !-)
Avatar billede gadebarnet Nybegynder
13. marts 2005 - 14:39 #5
ja, okay....

Men den skal kunne det samme som min...

Kan du lave et lille html der kan det ?
Avatar billede roenving Novice
13. marts 2005 - 14:43 #6
var strt = "bddef1",slut = "ffffff",interval = 10;

-- og et passende tal i inputten (som du bare kan fjerne og indsætte i knappen !-)
Avatar billede roenving Novice
13. marts 2005 - 14:44 #7
<button onclick="skiftBG('0.5');return false;">Skift baggrund</button>
Avatar billede gadebarnet Nybegynder
13. marts 2005 - 14:45 #8
Det er jo ikke helt samme efekt som mit IE ting ?

det skal bare være noget der sker...

Kan du rette det til ?
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 11:56 Er det muligt at lave sin egen webserver i boligforening? Af Strawberry i Cloudtjenester
I går 10:21 Ny printer, men hvilken Af mort1 i Printere
13/0819:41 USB på Linux Af Uvanga i Linux
12/0818:26 Hvilken type mus Af mort1 i PC
11/0813:21 ms Forms Af leahcim i Andet software
White papers
Flere white papers »