Javascript - Bildwechsel nach Uhrzeit

Ditin · 24.08.2009

AW: Javascript - Bildwechsel nach Uhrzeit

Hallo,

hier mal ein Beispielscript:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <title>Ohne Titel 1</title>

    <script type="text/javascript">
    function setCSS()  {
    var css = "tag.css";
    var jetzt = new Date();
    var Std = jetzt.getHours();
    var headTag = document.getElementsByTagName("head")[0];         
    var cssTag = document.createElement('link');
    
    if (Std >= 20) { css = "nacht.css"; }
    if (Std <= 7)  { css = "nacht.css";    }

    cssTag.type =  'text/css';
    cssTag.rel =   'stylesheet';
    cssTag.href =  'css/' + css;
    cssTag.media = 'screen';
    headTag.appendChild(cssTag);
    return true;
}

</script>
</head>

<body onload="setCSS();">

<span>Testeintrag</span>


</body>
</html>

merke, DOM ist besser als document.write und einfache if Schleifen sind leichter einzubauen

Mfg.

Dragoni25 · 24.08.2009

AW: Javascript - Bildwechsel nach Uhrzeit

Ditin schrieb:

Hallo,

hier mal ein Beispielscript:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
    <title>Ohne Titel 1</title>

    <script type="text/javascript">
    function setCSS()  {
    var css = "tag.css";
    var jetzt = new Date();
    var Std = jetzt.getHours();
    var headTag = document.getElementsByTagName("head")[0];         
    var cssTag = document.createElement('link');
    
    if (Std >= 20) { css = "nacht.css"; }
    if (Std <= 7)  { css = "nacht.css";    }

    cssTag.type =  'text/css';
    cssTag.rel =   'stylesheet';
    cssTag.href =  'css/' + css;
    cssTag.media = 'screen';
    headTag.appendChild(cssTag);
    return true;
}

</script>
</head>

<body onload="setCSS();">

<span>Testeintrag</span>


</body>
</html>

merke, DOM ist besser als document.write und einfache if Schleifen sind leichter einzubauen

Mfg.

Wow Spitze hat gleich auf anhieb geklappt. besten dank für deine lösung.

*freun*

lg
Dragon

ingee_123 · 27.03.2013

AW: Javascript - Bildwechsel nach Uhrzeit

Hallo zusammen,

ich hab da auch mal ein kleines Problemchen. Ich hab zwei unterschiedliche Weltkarten animiert, eine Karte ist die Tagesansicht, die andere Karte die Nachtansicht. Beide Animationen sind .swf und mittels <object> und <embed> in die html integriert. Soweit so gut, funktioniert auch auf der Website. Allerdings würde ich gerne die Tageskarte von morgens 8 Uhr bis abends 20 Uhr, und die Nachtkarte von abends 20 Uhr bis morgens 8 Uhr auf der Webseite anzeigen lassen. Ich hab jetzt soviel mit verschiedenen Javascript-Codes herumexperimientiert, aber nix ging und ich weiß auch nicht wirklich, wie ich das iniziieren soll. Für Hilfe wäre ich wirklich sehr dankbar.
Der html-code:

<div id="slide_show">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="1100" height="500" id="player1" align="middle">
<param name="movie" value="earth_nightswf.swf"/>
<param name="menu" value="false"/>
<param name="quality" value="high"/>
<param name="bgcolor" value="#FFFFFF"/>
<noscript><a href="http://www.dvdvideosoft.com/products/dvd/Free-Audio-Converter.htm">audio converter</a></noscript>
<embed src="earth_nightswf.swf" menu="false" quality="high" bgcolor="#FFFFFF" width="1100" height="500" name="player" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"/>
</object>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="1100" height="500" id="player1" align="middle">
<param name="movie" value="earth_dayswf.swf"/>
<param name="menu" value="false"/>
<param name="quality" value="high"/>
<param name="bgcolor" value="#FFFFFF"/>
<noscript><a href="http://www.dvdvideosoft.com/products/dvd/Free-Audio-Converter.htm">audio converter</a></noscript>
<embed src="earth_dayswf.swf" menu="false" quality="high" bgcolor="#FFFFFF" width="1100" height="500" name="player" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"/>
</object>
</div>

Im Moment werden beide swrf natürlich göeichzeitig untereinander auf der Site dargestellt. Bin kurz vorm Verzweifeln. Wie ist der richtige Javascript-code hierfür. In einer css-Datei kann ich die Karten ja nicht hinterlegen, oder ? Hab keine Ahnung mehr und sehe wahrscheinlich den Wald vor lauter Bäumen nicht. Vielen Dank für Euere Hilfe jetzt schon.

Liebe Grüße

ingee_123

Duddle · 27.03.2013

AW: Javascript - Bildwechsel nach Uhrzeit

Erstens: bitte grab keine Threads aus 2009 wieder aus. Es ist kein Problem, wenn du einen neuen aufmachst.

Du könntest es auch serverseitig unterscheiden, wenn dir JavaScript nicht zusagt. Falls du PHP nutzt, ist das .
Die JS-Variante ist auch recht trivial. Du holst dir die aktuelle Stunde und bzw. das entsprechende Element.

Duddle

ingee_123 · 27.03.2013

AW: Javascript - Bildwechsel nach Uhrzeit

Hallo Duddle,

danke für Deine Antwort. Ich bin neu hier und dachte, wenn ich jetzt ein neues Thema aufmache, dann werde ich auf dieses verwiesen, sorry.
Ich hab das jetzt folgendermaßen hingekriegt:

<div id="slide_show">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="1100" height="500" id="player1" align="middle">
<param name="menu" value="false"/>
<param name="quality" value="high"/>
<param name="bgcolor" value="#FFFFFF"/>
<noscript><img /></noscript>
<script type="text/javascript">
var swf = "";
var jetzt = new Date();
var Std = jetzt.getHours();
if (Std >= 8 && Std < 20) {
swf = "earth_dayswf.swf";
} else if (Std >= 20 || Std < 8) {
swf = "earth_nightswf.swf";
}
document.write('<embed src="' + swf + '" menu="false" quality="high" bgcolor="#FFFFFF" width="1100" height="500" name="player" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"/>');
</script>
</object>
</div>

Hab das mit der Zeitumstellung am Pc ausprobiert und läuft wie geschnitten Brot.
Hab auch gemerkt, bei meiner Rumwerkelei, dass es krasse Codeunterschiede gibt, je nachdem, ob man Musik oder Bilder wechseln möchte. Vielleicht ist mein Code hier ja auch für jemanden nützlich, würde mich freuen.

Viele liebe Grüße und ein frohes Osterfest an alle

ingee_123