Supportnet Computer
Planet of Tech

Supportnet / Forum / Webseiten/HTML

Wie Bilder überblenden / verschwimmen???





Frage

Ich möchte gerne 10 Bilder nacheinander zeigen und diese sollen langsam in einander übergehen (verschwimmen / überblenden). Wie kann ich das einfach und schnell erledigen? Ich habe nur wenig Kenntnisse von Scripten und bekomme nur das Einfachste hin. Gibt es evtl. auch Möglichkeiten mit den bei mir vorhanden Programmen (MS Frontpage, Micrografx Image 10). Konnte hier nix finden was etwas taugt. Vielen Dank! Monsterchen

Antwort 1 von Redschina

hi monsterchen,

hier eine ganz nette slide-show für deine bilder:

zwischen <head> und </head>

<script language="JavaScript">

// nachstehendes kannst du anpassen
var slideShowSpeed = 3000;
var crossFadeDuration = 3;
var Pic = new Array();
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[0] = '5.jpg'
Pic[1] = '6.jpg'
Pic[2] = '7.jpg'
Pic[3] = '8.jpg'
Pic[0] = '9.jpg'
Pic[1] = '10.jpg'

// nachstehendes nicht ändern bitte:
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad = new Image();
preLoad.src = Pic;
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}
// End -->
</script>

und der body-tag sollte mindestens so aussehen:

<body onLoad="runSlideShow()">

... aufrufen des bilderwechsels "irgendwo" auf deiner seite zwischen <body> und </body> mit

<img src="1.jpg" name='SlideShow' width=150 height=150>

gruß, redschina


ps: wobei du in der letzten zeile bei <img src=.......> breite und höhe natürlich auch noch anpassen solltest

Antwort 2 von rfb

@Redschina:
kann es sein, dass die indices hier ein bisschen durcheinandergekommen sind:
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[0] = '5.jpg'
Pic[1] = '6.jpg'
Pic[2] = '7.jpg'
Pic[3] = '8.jpg'
Pic[0] = '9.jpg'
Pic[1] = '10.jpg'
übrigens reagiert Netscape gelegentlich sauer auf das fehlende ";" am Ende der Zeilen.

Antwort 3 von Redschina

ups... ja klar! danke rfb - ich hatte das script ursprünglich für 4 bilder und habe leider versäumt, alles anzupassen *schäm*

aber nett von monsterchen, dass er mir noch nicht den kopf abgerissen hat :-)

Ich möchte kostenlos eine Frage an die Mitglieder stellen:


Ähnliche Themen:


Suche in allen vorhandenen Beiträgen: