JavaScripts -> Animation -> Image Matrix
Bei diesem Script werden viele Bilder angezeigt, die sich ständig ändern, hübscher Effekt.
Kompatibilität getestet:
Script-Code
<script type="text/javascript">
<!--
// = = ================================================================= = =
// = = Image Matrix v1.0 (c) 2004 Triple-M / http://www.htmlarsenal.de = =
// = = ================================================================= = =
// -------------------------------------------------------------------------
// -- Dieses Script und viele andere im --
// -- This script and many more in the --
// -------------------------------------------------------------------------
// -- HTML ARSENAL - Die Quelle für HTML, JavaScript, PHP --
// -- HTML ARSENAL - Your Source for HTML, JavaScript, PHP --
// -------------------------------------------------------------------------
// -- -= http://www.htmlarsenal.de =- --
// -------------------------------------------------------------------------
// Sie dürfen dieses Script für nicht-kommerzielle Zwecke nutzen, wenn diese Urheber-Notiz erhalten bleibt.
// You may use this Script for non-commercial causes as long as you include this copyright notice.
// Benutzung / Usage
// =================
// Fügen Sie ein Script mit dem Inhalt imagematrix(Breite,Höhe); an der Stelle ein, an der die Image Matrix erscheinen soll.
// Breite und Höhe bedeuten dabei die Dimensionen der Matrix in Bildern.
// Include a script with the content imagematrix(width, height); at the position where the image matrix shall be displayed.
// width and height mean the dimensions of the matrix in pictures
// Veränderbare Einstellungen / Adjustable Settings
// ================================================
var imgurls=new Array("/pics/examples/cf01.jpg","/pics/examples/cf02.jpg","/pics/examples/cf03.jpg","/pics/examples/cf04.jpg");
// URLs der Bilder
// Script-Code
// ===========
// Ab hier bitte nichts mehr verändern
// Please do not change anything from here on
var imgs=new Array();
var n;
for(n=0;n<imgurls.length;n++) {
imgs[n]=new Image();
imgs[n].src=imgurls[n];
}
function dothematrix(id,xd,yd) {
var x,y,ni;
x=Math.floor(Math.random()*xd);
y=Math.floor(Math.random()*yd);
ni=Math.floor(Math.random()*imgs.length);
document.getElementById('imm_'+id+'_'+x+'_'+y).setAttribute("src",imgs[ni].src);
}
function imagematrix(xd,yd) {
var i,j,id;
id=Math.floor(Math.random()*10000);
document.writeln('<table style="border-collapse:collapse; border:0px none">');
for(i=0;i<yd;i++) {
document.writeln('<tr>');
for(j=0;j<xd;j++) {
document.writeln('<td style="padding:0px">');
document.write('<img id="imm_'+id+'_'+j+'_'+i+'" src="'+imgs[Math.floor(Math.random()*imgs.length)].src+'">');
document.writeln('</td>');
}
document.writeln('</tr>');
}
document.writeln('</table>');
window.setInterval("dothematrix("+id+","+xd+","+yd+")",50);
}
// ----------------------------
// -- Ende / End Script-Code --
// ----------------------------
// -- Image Matrix --
// -- Author: Triple-M --
// -- www.htmlarsenal.de --
// -- 24.Mar.2004 --
// ----------------------------
//-->
</script>
<!--
// = = ================================================================= = =
// = = Image Matrix v1.0 (c) 2004 Triple-M / http://www.htmlarsenal.de = =
// = = ================================================================= = =
// -------------------------------------------------------------------------
// -- Dieses Script und viele andere im --
// -- This script and many more in the --
// -------------------------------------------------------------------------
// -- HTML ARSENAL - Die Quelle für HTML, JavaScript, PHP --
// -- HTML ARSENAL - Your Source for HTML, JavaScript, PHP --
// -------------------------------------------------------------------------
// -- -= http://www.htmlarsenal.de =- --
// -------------------------------------------------------------------------
// Sie dürfen dieses Script für nicht-kommerzielle Zwecke nutzen, wenn diese Urheber-Notiz erhalten bleibt.
// You may use this Script for non-commercial causes as long as you include this copyright notice.
// Benutzung / Usage
// =================
// Fügen Sie ein Script mit dem Inhalt imagematrix(Breite,Höhe); an der Stelle ein, an der die Image Matrix erscheinen soll.
// Breite und Höhe bedeuten dabei die Dimensionen der Matrix in Bildern.
// Include a script with the content imagematrix(width, height); at the position where the image matrix shall be displayed.
// width and height mean the dimensions of the matrix in pictures
// Veränderbare Einstellungen / Adjustable Settings
// ================================================
var imgurls=new Array("/pics/examples/cf01.jpg","/pics/examples/cf02.jpg","/pics/examples/cf03.jpg","/pics/examples/cf04.jpg");
// URLs der Bilder
// Script-Code
// ===========
// Ab hier bitte nichts mehr verändern
// Please do not change anything from here on
var imgs=new Array();
var n;
for(n=0;n<imgurls.length;n++) {
imgs[n]=new Image();
imgs[n].src=imgurls[n];
}
function dothematrix(id,xd,yd) {
var x,y,ni;
x=Math.floor(Math.random()*xd);
y=Math.floor(Math.random()*yd);
ni=Math.floor(Math.random()*imgs.length);
document.getElementById('imm_'+id+'_'+x+'_'+y).setAttribute("src",imgs[ni].src);
}
function imagematrix(xd,yd) {
var i,j,id;
id=Math.floor(Math.random()*10000);
document.writeln('<table style="border-collapse:collapse; border:0px none">');
for(i=0;i<yd;i++) {
document.writeln('<tr>');
for(j=0;j<xd;j++) {
document.writeln('<td style="padding:0px">');
document.write('<img id="imm_'+id+'_'+j+'_'+i+'" src="'+imgs[Math.floor(Math.random()*imgs.length)].src+'">');
document.writeln('</td>');
}
document.writeln('</tr>');
}
document.writeln('</table>');
window.setInterval("dothematrix("+id+","+xd+","+yd+")",50);
}
// ----------------------------
// -- Ende / End Script-Code --
// ----------------------------
// -- Image Matrix --
// -- Author: Triple-M --
// -- www.htmlarsenal.de --
// -- 24.Mar.2004 --
// ----------------------------
//-->
</script>