Avatar billede leif Seniormester
06. september 2010 - 16:31 Der er 5 kommentarer og
1 løsning

Få baggrunden til at skifte farve

Hej,

Jeg har følgende JavaScript til at tælle op i et input hvor mange sekunder der er gået, men nu ville det være dejligt at hvis der er gået fx. 1 min. så skifter baggrunden farve enten i feltet eller optimalt på hele siden

//Code start
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
startday = new Date();
clockStart = startday.getTime();
function initStopwatch() {
var myTime = new Date();
return((myTime.getTime() - clockStart)/1000);
}
function getSecs() {
    var tSecs = Math.round(initStopwatch());
    var iSecs = tSecs % 60;
    var iMins = Math.round((tSecs-30)/60);
    var sSecs ="" + ((iSecs > 9) ? iSecs : "0" + iSecs);
    var sMins ="" + ((iMins > 9) ? iMins : "0" + iMins);
    document.getElementById("timespent").value = sMins+":"+sSecs;
    window.setTimeout('getSecs()',1000);
}
// End -->
</script>
//Code END

Kan nogen hjælpe med det ?

/Leif
Avatar billede tjens Nybegynder
07. september 2010 - 00:11 #1
Demoscript til ændring af baggrundsfarve:
<script type="text/javascript">
var i = 0;
var colors = ["palegreen", "yellow", "lightblue", "orange", "ivory"];

function changeBG() {
    document.body.style.backgroundColor = colors[i];
    i++;
    if (i < 5) {
        setTimeout("changeBG()", 1000);
    }
}

window.onload=changeBG;
</script>
Avatar billede leif Seniormester
07. september 2010 - 11:18 #2
Jeg synes ikke jeg får det til at fungere som jeg vil.

Jeg har reelt, men fulde kode er:

<?php
$refreshrate = "10";
header("Refresh: $refreshrate");
$htmlbackground = "red";
?>
<HTML>
  <HEAD>
    <TITLE>test</TITLE>
    <style type="text/css">
      body {
        font-family: Verdana, Times New Roman;
        font-size: 12px;
        color: #000000;
        margin-left: 12;
        margin-right: 12;
        margin-top: 16;

<?php
echo '  background-color:'.$htmlbackground.';';
?>
      }

      table {
        font-family: Verdana, Times New Roman;
        font-size: 12px;
      }
    </style>

<SCRIPT LANGUAGE="JavaScript">
startday = new Date();
clockStart = startday.getTime();
function initStopwatch() {
var myTime = new Date();
return((myTime.getTime() - clockStart)/1000);
}
function getSecs() {
    var tSecs = Math.round(initStopwatch());
    var iSecs = tSecs % 60;
    var iMins = Math.round((tSecs-30)/60);
    var sSecs ="" + ((iSecs > 9) ? iSecs : "0" + iSecs);
    var sMins ="" + ((iMins > 9) ? iMins : "0" + iMins);

    document.getElementById("timespent").value = sMins+":"+sSecs;
    window.setTimeout('getSecs()',1000);
}

</script>

</HEAD>
        <BODY onLoad="window.setTimeout('getSecs()',1)">

        <form name="timespent-form">
        <input size=5 id="timespent" name="timespent">
        </form>
</BODY>
</HTML>


Som skal at når den kommer til: 45 sec eller 1 min. så skal den skifte baggrundsfarve til fx. yellow


Det er til en status skærm som opdaterer sig selv hver 10 sec. men jeg vil gerne have at hvis den ikke får refresh som den skal skifter den farve, det jeg oplever nu er at bare at feltet timespent bliver ved med at tælle op.'

/Leif
Avatar billede tjens Nybegynder
07. september 2010 - 21:31 #3
Indsæt var count = 0;   som første linie i din javascript.

Indsæt
  count++;
  if (count > 45) {
      document.body.style.backgroundColor = "pink";
  }
i din function getSecs()
Avatar billede leif Seniormester
07. september 2010 - 21:44 #4
Simpel løsning, tak.

Smid et svar.



P.S: Hvordan er det nu vi laver boksen som du har gjort ?
Avatar billede vejmand Juniormester
07. september 2010 - 21:53 #5
Avatar billede tjens Nybegynder
07. september 2010 - 22:05 #6
#1 er et svar
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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.

Du kan også logge ind via nedenstående tjenester