Ferienhaus Micki in Tschechien


 

Wie ich auf einer meiner Website täglich ein anderes Bild anzeigen lasse.

 

Tagesbild mit einfachem php-Script realisieren.

 
Script für Bild des Tages: zum Beispiel für  Girl des Tages
 

Als Insektenfreund möchte ich, dass auf einer meiner html-Seiten im Internet an jedem Tag ein anderes Insekt dargestellt wird. Zusätzlich möchte ich erreichen, dass an besonderen Tagen (z. B. am 1. Mai, am 24. Dezember, am 31. Dezember, am 1. Januar, am 8. März, am 14. Februar) ganz bestimmte Insekten angezeigt werden. Das bedeutet, ich will bestimmen, was wann angezeigt wird und nicht der Zufall.


 
Die einfachste Möglichkeit dies zu realisieren bietet PHP.

Wer nicht von vornherein seine Webseiten in php benannt hat kann durch einen Eintrag in der Datei .htaccess auf dem Server erreichen, dass auch auf seinen "normalen" Seiten mit der Endung htm oder html php-Scripte funktionieren.

Diese 2 Zeilen müssen in die .htaccess eingefügt werden:

addtype application/x-httpd-php .htm
addtype application/x-httpd-php .html
 

Als Test, ob diese Maßnahme erfolgreich war kann man in den zwischen <body> und </body> in seine htm- oder html-Seite folgenden Code eingeben:

 

<?php
echo "Hallo Welt";
?>

 

Wenn dann die Seite auf den Server geladen wurde und im Browser aufgerufen wird, erscheint irgendwo auf der Seite de Zeile "Hallo Welt"

Wir gehen mal davon aus, dass PHP nun funktioniert. :-)

Lege zunächst ein Verzeichnis auf dem Server an, wo die Bilder gespeichert werden sollen. Zum Beispiel im Ordner bilder noch einen Unterordner insekten erstellen. Unsere Insektenbilder benennen wir für jeden Tag des Jahres, angefangen von 0101.jpg für den 1. Januar bis 3112.jpg für den letzten Tag des Jahres. Für besondere Tage des Jahres verwenden wir auch besondere Bilder. Zum Beispiel das Bild 2412.jpg zeigt ein Weihnachts-Insekt mit Zipfelmütze oder so. Zusätzlich nehmen wir noch ein Bild her, das angezeigt werden soll, wenn irgend etwas nicht klappt, vielleicht mal ein Bild fehlt oder der 29. Februar ist. Dieses Bild nennen wir dann default.jpg  Als nächstes senden wir alle 366 Bilder auf den Server in den Ordner insekten und vergessen nicht in den Ordner auch eine Datei index.htm hinzuzufügen, damit dort nicht jeder herumwühlen kann.
 

Folgender Code kommt nun in der Html-Seite an die Stelle, wo das Insektenbild später erscheinen soll:


 

<?php
$defaultbild = "bilder/insekten/default.jpg";
$heute_tag = date("dm", time());
$anzeigenbild = 'bilder/insekten/'.$heute_tag.'.jpg';
if(file_exists($anzeigenbild))
{
echo '<img src="'.$anzeigenbild.'">';
}else{
echo '<img src="'.$defaultbild.'">';
}
?>

 

Falls 365 Bilder zu viel sind, kann man auch klein anfangen. Man nimmt eben nur 31 Insekten und füllt somit einen Monat. Das Script sieht dann folgendermaßen aus:

 

<?php
$defaultbild = "bilder/insekten/default.jpg";
$heute_tag = date("d", time());
$anzeigenbild = 'bilder/insekten/'.$heute_tag.'.jpg';
if(file_exists($anzeigenbild))
{
echo '<img src="'.$anzeigenbild.'">';
}else{
echo '<img src="'.$defaultbild.'">';
}
?>

 

Man benötigt 31 Bilder: 01.jpg, 02.jpg ... 31.jpg
 


 

Falls es doch mit PHP Schwierigkeiten gibt, kann man es auch mit JavaScript probieren.
Das könnte dann für 5 Tage etwa so aussehen (funktioniert!):

im <HEAD>


<SCRIPT LANGUAGE="JAVASCRIPT">
<!--
function randtext() {
var quotenumber =
5;
var randomnumber = Math.random() ;
var rand1 = Math.round( (quotenumber-1) * randomnumber) + 1 ;
quotes = new Array
quotes[1] = '<IMG SRC="/pics/bild1.jpg">';
quotes[2] = '<IMG SRC="/pics/bild2.jpg">';
quotes[3] = '<IMG SRC="/pics/bild3.jpg">';
quotes[4] = '<IMG SRC="/pics/bild4.jpg">';
quotes[5] = '<IMG SRC="/pics/bild5.jpg">';
var quote = quotes[rand1];
return quote;
}
//-->
</SCRIPT>

 
im <BODY>


<SCRIPT LANGUAGE="JavaScript">
<!--
document.write(randtext());
//-->
</SCRIPT>



-------------------------------------------------------------------------------------------

hier eine weitere funktionierende Variante:

im <head>:

<script language="JavaScript" type="text/javascript">
<!--
var tag = new Date();
var heute = tag.getDay();
var bild = new Array();
bild[1]="bilder/insekten/1.jpg";
bild[2]="bilder/insekten/2.jpg";
bild[3]="bilder/insekten/3.jpg";
bild[4]="bilder/insekten/4.jpg";
bild[5]="bilder/insekten/5.jpg";
bild[6]="bilder/insekten/6.jpg";
bild[7]="bilder/insekten/7.jpg";

function bild_des_tages()
{
document.getElementById('bild').innerHTML = '<img src="' + bild[heute] + '" border="0" />';
}
//-->
</script>
 

im <body> sieht es beispielsweise so aus:

<body onload="bild_des_tages();">
<div id="bild"></div>
</body>

------------------------------------------------------------------------------------------------

und schließlich noch eine weitere Variante einer funktionierenden Zufalls-Bildanzeige

 

Zwischen <head> und </head> kommt:

 

<script language="JavaScript">
var theImages = new Array()

theImages[0] = 'bilder/zufall/000.jpg'
theImages[1] = 'bilder/zufall/001.jpg'
theImages[2] = 'bilder/zufall/002.jpg'
theImages[3] = 'bilder/zufall/003.jpg'
theImages[4] = 'bilder/zufall/004.jpg'
theImages[5] = 'bilder/zufall/005.jpg'
theImages[6] = 'bilder/zufall/006.jpg'
theImages[7] = 'bilder/zufall/007.jpg'
theImages[8] = 'bilder/zufall/008.jpg'
theImages[9] = 'bilder/zufall/009.jpg'
theImages[10] = 'bilder/zufall/010.jpg'
theImages[11] = 'bilder/zufall/011.jpg'
theImages[12] = 'bilder/zufall/012.jpg'
theImages[13] = 'bilder/zufall/013.jpg'
theImages[14] = 'bilder/zufall/014.jpg'
theImages[15] = 'bilder/zufall/015.jpg'
theImages[16] = 'bilder/zufall/016.jpg'
theImages[17] = 'bilder/zufall/017.jpg'
theImages[18] = 'bilder/zufall/018.jpg'
theImages[19] = 'bilder/zufall/019.jpg'

var j = 0
var p = theImages.length;

var preBuffer = new Array()
for (i = 0; i < p; i++){
preBuffer[i] = new Image()
preBuffer[i].src = theImages[i]
}

var whichImage = Math.round(Math.random()*(p-1));
function showImage(){
document.write('<img src="'+theImages[whichImage]+'">');
}

</script>
 

und zwischen <body> und </body> kommt

 

<script language="JavaScript">
<!--
showImage();
//-->
</script>
 

an der Stelle, wo das Zufallsbild erscheinen soll.

 

Viel Erfolg!

 

In der Praxis kann man das Script bei Mädchen des Tages sehen. Viel Spaß!