Gruppen

Top Gruppen: Windows 7; Windows Vista; Windows XP; Textverarbeitung; Excel; DSL; Internet Browser; E-Mail/Outlook
Betriebsysteme: Windows classik; Linux; BS-Sonstige
Software: Datenbanken; Bildbearbeitung; Audio/mp3/Video; Security/Viren; SW-Sonstige
Hardware: Mainboard/CPU; Grafikkarten; Peripherie; Laptop/Notebook; HW-Sonstiges
Netzwerk: Telefon,ISDN,Modem; W-Lan; NW-Sonstiges
Programmierung: PHP,ASP,Perl...; Java,C++...; Webseiten/HTML
Sonstiges: PC-Sonstiges; Plauderecke; SN Intern; Test

/ Forum / Anwendungen(Java,C++...)

Anwendungen(Java,C++...)

Fragevon sMoKe1983 vom 04.03.2022, 00:13 Options

Weicher Bildwechsel mit JavaScript

Ich bin leider nicht so der JavaScript Profi. Aber ich weiß das man mit den jQuery-Effekten (in meinem Fall "opacity") wunderbar einen weichen Bildwechsel realiseren kann. Nur leider weiß ich nicht genau wie. Bis jetzt sieht mein Code so aus (wodurch die Bilder wechseln aber nicht weich überblenden):

<html>
    <head>
        <script language="JavaScript">
			<!--
			
			verzoegerung = 1200;
			bildNummer = 1;
			
			bilder= new Array();
			
			for (i = 1; i <= 2; i++) {
			bilder[i] = new Image();
			bilder[i].src = "images/kasten2_" + i + ".png";.
			}
			
			function naechstesBild() {
			document.animation.src = bilder[bildNummer].src;
			$(this).animate ({ opacity: "0" }, 1000);
			
			bildNummer++;
			if (bildNummer > 2) bildNummer = 1;
			}
			
			// -->
		</script>
    </head>
    <body>
        <img src="images/kasten2_1.png" name="animation" onLoad="setTimeout('naechstesBild()', verzoegerung)">
    </body>
</html>

Was muss ich jetzt ändern damit die Bilder weich überblenden? Ich weiß das der Befehlt dafür lautet:

$(this).animate ({ opacity: "0" }, 1000);

aber nicht genau wo er rein muss. Kann mir jemand helfen?

Antwort schreiben

Antwort 1 von sMoKe1983 vom 04.03.2022, 00:20 Options

Habe es im falschen Bereich eingestellt, zudem ist im Code ein kleiner Fehler: Die Zeile "$(this).animate ({ opacity: "0" }, 1000);" OBEN im Code muss weg.

KANN GELÖSCHT WERDEN!

Hinweis

Diese Frage ist schon etwas älter, Sie können daher nicht mehr auf sie antworten. Sollte Ihre Frage noch nicht gelöst sein, stellen Sie einfach eine neue Frage im Forum..

Neue Einträge

Tipp einschicken

News einschicken