Textfarbe mit Java ändern

Eastern911 · 06. Nov. 2014

Hallo Zusammen.

ich habe jetzt schon seit heute Mittag gesucht und gesucht, aber mir fehlen wahrscheinlich einfach die Kenntnisse um meine Suchergebnisse zu verstehen.
Ich hab ein Problem. Ich habe mir einen HTML-basierten Sperrbildschirm für mein iPhone gebastelt, mit Uhr und Datum. Soweit alles schick.
Nun will ich aber die Textfarbe via JS ändern.

Jetzt lagere ich die die Javascript Funktionen für Uhr und Datum in eine ext. Datei "scripts.js" aus und erstelle eine zusätzliche Datei "conifg.js" in der ich später über var Farbe = meineausgewählteFarbe die Textfarbe meines Texts auf dem Sperrbildschirm ändern. (Es soll nur die Farbwahl in die config.js ausgelagert werden.

Kann mir bitte jemand verraten wie ich das anstelle?

Danke!

Zum Code (es ist noch nichts ausgelagert):

HTML:

<html>
<!-- Dieser Lockscreen stammt aus dem SubtleGroove pack Von  @Eastern911 -->
    <head>


	<meta name="viewport" content="width=device-width"/>
       
<style type="text/css">
@font-face {
    font-family: 'poiret_oneregular';
    src: url('poiretone-webfont.eot');
    src: url('poiretone-webfont.eot?#iefix') format('embedded-opentype'),
	 url('poiretone-webfont.woff') format('woff'),
	 url('poiretone-webfont.ttf') format('truetype'),
	 url('poiretone-webfont.svg#poiret_oneregular') format('svg');
    font-weight: bold;
    font-style: normal;
} 

#uhr {
font-family: "poiret_oneregular";
font-size: 350%;
Position:absolute;
Top: 15px;
Color: black; 
}

#datum {
Width: 100px;
font-family: "poiret_oneregular";
font-size: 130%;
Position:relative;
top:15px;   
text-align: right;
margin-left: auto;
margin-right: 2px;
Color: black;
}
#line {
    position:relative;
    top: 5px;
}


</style>

    <title> SubtleGroove</title>

    <script language="JavaScript">
     
      var jahr=2014, monat=09, tag=09, stunde=19, minute=00, sekunde=00;
      var zielDatum=new Date(jahr,monat-1,tag,stunde,minute,sekunde);

  
	     function uhrzeit(anzeige) {
Heute = new Date();//Es wird ein neues Datum angelegt.
Stunde	= Heute.getHours();//Die Variable Stunde wird erstellt
Minute	= Heute.getMinutes();//Die Variable Minute wird erstellt
Sekunde = Heute.getSeconds();//Die Variable Sekunde wird erstellt
document.getElementById("uhr").innerHTML=Stunde+":"+((Minute<=9)?"0"+Minute:Minute);

}
    
 function getZeit()
    {
	var Zeit = new Date();
	var Jahr = Zeit.getFullYear();
	var Monate = Zeit.getMonth()+1;
	 Monate = (Monate < 10) ? "0" + Monate : Monate;
	var Tag = Zeit.getDate();
	Tag = (Tag < 10) ? "0" + Tag : Tag;
	var Datum = Tag + "." + Monate + "." + Jahr;
	 document.getElementById("Datum").innerHTML = Datum;

	var Wochentage = new Array("Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag");
	var Wochentag = Wochentage[Zeit.getDay()];
	 document.getElementById("Datum").innerHTML=Wochentag+" "+Datum;

   
	setTimeout("getZeit()",1000);
    }

      

    </script>
  </head>

  <body onload="uhrzeit('jetzt'); setInterval('uhrzeit()', 1000);getZeit();">
     
    <div id="uhr">
    </div>
    <div id="Datum">
    </div>		
      <hr id="line">
  </body>

</html>

kkapsner · 07. Nov. 2014

1. Herzlich willkommen im Forum.
2. Bitte beachte bei kommenden Beiträgen Folgendes: http://forum.jswelt.de/smalltalk/60175-code-tags-richtig-setzen.html#post387843
3. Externe JS-Dateien einzubinden ist im Browser einfach. Einfach ein <script src="pfad/zur/datei.js"></script> einfügen. Ob das bei einem Sperrbildschirm auch so funktioniert, weiß ich nicht, aber es ist einen Versuch wert.
4. Dein HTML ist invalide - so fehlt eine DocType und dem <head> fehlt ein <title>. Auch verwendest du veraltete Sachen (z.B. das language-Attribut im <script> - einfach weg damit),
5. Du solltest dir gleich am Anfang angewöhnen, deinen Code sauber zu formatieren. Macht den Code viel lesbarer/verständlicher/wartbarer.
6. Dein JS ist auch nicht optimal. So sollte man window.setTimeout() und window.setInterval() keinen String, sondern eine Funktionsreferenz als Parameter übergeben:

Code:

window.setInterval(uhrzeit, 1000);

.
Auch sind globale Variablen möglichst zu vermeiden.
Das ganze Zeug für zielDatum wird gar nicht weiterverwendet - oder hast du da noch was bestimmtes vor?
Dann (über-)schreibst du zwei mal das gleiche .innerHTML in getZeit().
Und zu guter Letzt sind deine Funktionsnamen nicht sehr glücklich gewählt - alleine schon die Mischung aus Deutsch und Englisch ist nicht gut. Und dann macht getZeit() nicht mit der Zeit, sondern ist für's Datum zuständig.

... ach und da fällt mir noch was auf: ändert sich bei dir das Datum wirklich jede Sekunde? getZeit könntest du viel seltener aufrufen - würde damit deinem Handyakku zu Gute kommen.

PS: JAVA != JavaScript

dbarthel · 07. Nov. 2014

kkapsner;387963 6. Dein JS ist auch nicht optimal. So sollte man [url="https://developer.mozilla.org/en/DOM/window.setTimeout" schrieb:
window.setTimeout()[/url] und window.setInterval() keinen String, sondern eine Funktionsreferenz als Parameter übergeben:

Code:

window.setInterval(uhrzeit, 1000);

.

@Eastern911:

eine weitere Möglichkeit wäre, es so zu umschreiben:

Code:

var myVar=setInterval(function () {uhrzeit()}, 1000);

nur so als Anmerkung, ansonsten natürlich besser so, wie von kkapsner beschrieben.

Textfarbe mit Java ändern

Eastern911

New member

kkapsner

Super Moderator

dbarthel

Lounge-Member