nicht angemeldet
Automatischer Bildwechsel
JürgenB
StruppiHi!
Ich habe ein Problem. Und zwar möchte ich, dass ein Bild nach einer Sekunde durch ein anderes ersetzt wird. Dann soll das Neue auch wieder durch ein Bild ersetzt werden usw.
Ich hab schon probiert, bin aber immer wieder gescheitert. Kann mir bitte jemand einen Anstoß geben? Oder hat jemand ein fertiges Script?
Vielen Dank für eure Hilfe!
greetz Tobi
-
hi,
Ich habe ein Problem. Und zwar möchte ich, dass ein Bild nach einer Sekunde durch ein anderes ersetzt wird. Dann soll das Neue auch wieder durch ein Bild ersetzt werden usw.
Ich hab schon probiert, bin aber immer wieder gescheitert. Kann mir bitte jemand einen Anstoß geben?Kombiniere die Bildertauschmethode aus dem Anwendungsbeispiel Dynamische grafische Buttons mit einem zeitgesteuerten Aufruf über setInterval bzw. setTimeout.
Und bei dem kurzen Zeitabstand solltest du vermutlich die Bilder vorladen.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Ok, danke! Dann versuch ich mich mal!
Vielen Dank!
greetz Tobi -
Hi!
Ich habe es jetzt soweit, dass das erste Bild durch das zweite ersetzt wird. Aber weiter macht es nicht. Wie schaffe ich es, dass in dieser Zeilevar aktiv = window.setInterval("Bildwechsel(0, Prozent20)", 1000);
der Parameter "Bildnr" jedesmal um eins erhöht wird? Und der Parameter "Bildobjekt" sollte auch verändert werden. Wie kann ich das machen?
Hier ist mein Quelltext:
################################################################
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>
<head>
<title>Bild</title>
<link rel="STYLESHEET" type="text/css" href="css.css">
<script type="text/javascript">
var aktiv = window.setInterval("Bildwechsel(0, Prozent20)", 1000);Prozent20 = new Image();
Prozent20.src = "bild_copy20.png";Prozent30 = new Image();
Prozent30.src = "bild_copy30.png";Prozent40 = new Image();
Prozent40.src = "bild_copy40.png";Prozent50 = new Image();
Prozent50.src = "bild_copy50.png";Prozent60 = new Image();
Prozent60.src = "bild_copy60.png";Prozent70 = new Image();
Prozent70.src = "bild_copy70.png";Prozent80 = new Image();
Prozent80.src = "bild_copy80.png";Prozent90 = new Image();
Prozent90.src = "bild_copy90.png";Prozent100 = new Image();
Prozent100.src = "bild_copy.png";function Bildwechsel (Bildnr, Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
</script>
</head><body>
<div id="bild">
<img src="bild_copy10.png" alt="" width="1000" height="125" border="0">
</div></body>
</html>
################################################################
Vielen Dank für jede Hilfe!
greetz Tobi-
hi,
Wie schaffe ich es, dass in dieser Zeile
var aktiv = window.setInterval("Bildwechsel(0, Prozent20)", 1000);
der Parameter "Bildnr" jedesmal um eins erhöht wird?
Am einfachsten - gar nicht.
Übergebe die Werte nicht als Parameter an die Funktion, sondern lege sie in globalen Variablen ab.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Zuerst vielen Dank für deine Antwort. Aber ähm, tut mir leid, aber ich weiß nicht, wie ich das genau machen soll.
Die Variable binde ich so ein, oder?:window.setInterval("Bildwechsel(" + var + ", Prozent20)", 1000);
Aber wie erreiche ich, dass die Globalvariable um eins erhöht wird? Schließlich habe ich keine Funktion, an deren Ende ich dann var + 1 schreiben könnte.
Vielen Dank für die kommenden Antworten.
greetz, Tobi-
hi,
Die Variable binde ich so ein, oder?:
window.setInterval("Bildwechsel(" + var + ", Prozent20)", 1000);
Nein, wenn du eine globale Variable nutzt, musst du sie nicht erst als Parameter an die Funktion übergeben.
Aber wie erreiche ich, dass die Globalvariable um eins erhöht wird?
In dem du irgendwo eins draufaddierst - ja, das kann auch innerhalb einer Funktion sein, wenn du dafür gesorgt hast, dass die Variable global ist.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Danke für deine Antwort!
Ich habe es jetzt so geschrieben:
###############################################
var i = 0;
var a = 0;
function Bild() {
window.setInterval("Bildwechsel(i, a)", 1000);
i + 1;
a + 1;
}
Prozent20 = new Image();
Prozent20.src = "bild_copy20.png";Prozent30 = new Image();
Prozent30.src = "bild_copy30.png";
###############################################
Mein hoffentlich letztes Problem ist, dass ich nicht weiß wie ich die Variable a erhör. Der Inhalt muss ja "Prozent20" sein. Und beim nächsten mal dann "Prozent30". Wie erreiche ich das?
Vielen Dank und greetz Tobi-
hi,
Mein hoffentlich letztes Problem ist, dass ich nicht weiß wie ich die Variable a erhör. Der Inhalt muss ja "Prozent20" sein. Und beim nächsten mal dann "Prozent30". Wie erreiche ich das?
Am besten gar nicht - wenn du Daten gleicher Art ablegen willst, nutze dazu keine "durchnummerierten" Variablennamen, sondern ein Array.
(Esa ginge natürlich - dann setzt du den Wert von a eben aus "Prozent"+x zusammen, wobei x den Zahlenwert enthält. Aber wie gesagt, es wäre Unfug.)
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Ich habe das jetzt mit einem Array probiert. Aber irgendwie funktioniert es nicht. Woran liegt es?#################################################################
<html>
<head>
<title>Bild</title>
<link rel="STYLESHEET" type="text/css" href="css.css">
<script type="text/javascript">
var i = 0;
var a = new Array("Prozent20", "Prozent30", "Prozent40", "Prozent50", "Prozent60", "Prozent70", "Prozent80", "Prozent90", "Prozent100");
function Bild() {
for (var b = 0; b < a.length; ++b)
window.setInterval("Bildwechsel(i, a[b])", 1000);
i + 1;
a + 1;
}
Prozent20 = new Image();
Prozent20.src = "bild_copy20.png";Prozent30 = new Image();
Prozent30.src = "bild_copy30.png";Prozent40 = new Image();
Prozent40.src = "bild_copy40.png";Prozent50 = new Image();
Prozent50.src = "bild_copy50.png";Prozent60 = new Image();
Prozent60.src = "bild_copy60.png";Prozent70 = new Image();
Prozent70.src = "bild_copy70.png";Prozent80 = new Image();
Prozent80.src = "bild_copy80.png";Prozent90 = new Image();
Prozent90.src = "bild_copy90.png";Prozent100 = new Image();
Prozent100.src = "bild_copy.png";function Bildwechsel (Bildnr, Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
</script>
</head><body>
<div id="bild">
<img src="bild_copy10.png" alt="" width="1000" height="125" border="0">
</div>
</body>
</html>
##################################################################
Vielen Dank für deine Hilfe!
Greetz Tobi-
hi,
Ich habe das jetzt mit einem Array probiert.
_So_ war es nicht gemeint.
var a = new Array("Prozent20", "Prozent30", "Prozent40", "Prozent50", "Prozent60", "Prozent70", "Prozent80", "Prozent90", "Prozent100");
Du sollst nicht die Namen deiner Variablen in einem Array speichern -
sondern diese Werte:Prozent20 = new Image();
Prozent20.src = "bild_copy20.png";Prozent30 = new Image();
Prozent30.src = "bild_copy30.png";
...- anstatt die durchnummerierten Variablennamen zu verwenden.
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Könntest du mir bitte in einem Beispiel verdeutlichen, wie du es meinst? Das wäre sehr nett von dir, weil ich wirklich nicht verstehe, wie du es meinst; und erst recht nicht, wie ich das umsetzen sollte.
Vielen vielen Dank!
greetz Tobi-
hi,
Könntest du mir bitte in einem Beispiel verdeutlichen, wie du es meinst?
Deine Version:
var Variable1 = Wert1;
var Variable2 = Wert2;
var Variable3 = Wert3;
alert(Variable1);Array-Version:
var Werte = new Array(Wert1, Wert2, Wert3);
alert(Werte(0));gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Was meinst du mit "Wert"? Soll ich das im Array speichern?:Prozent20 = new Image(); \ ----->Wert1
Prozent20.src = "bild_copy20.png"; /Prozent30 = new Image(); \ ----->Wert2
Prozent30.src = "bild_copy30.png"; /
.
.
.
Wenn ja, wie kann ich dann die "" escapen?
Vielen Dank!
Greetz, Tobi-
hi,
Soll ich das im Array speichern?:
Prozent20 = new Image(); \ ----->Wert1
Prozent20.src = "bild_copy20.png"; /Ja, genau.
Neues Bildobjekt anlegen, Quelle zuweisen, Referenz in Array ablegen (siehe Erklärung zum Array-Objekt in SELFHTML).Wenn ja, wie kann ich dann die "" escapen?
Wozu?
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Ich habe es jetzt so gemacht. Ich hoffe es ist richtig. Jedenfalls von der Idee her. Weil funktionieren tut es nicht :'(( Selbst die JS-Konsole sagt nichts. Wo liegt der Fehler?
#################################################################
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>
<head>
<title>Bild</title>
<link rel="STYLESHEET" type="text/css" href="css.css">
<script type="text/javascript">
var Bild = new Array();
Bild[0] = new Image();
Bild[0].src = "bild_copy20.png";
Bild[1] = new Image();
Bild[1].src = "bild_copy30.png";
Bild[2] = new Image();
Bild[2].src = "bild_copy40.png";
Bild[3] = new Image();
Bild[3].src = "bild_copy50.png";
Bild[4] = new Image();
Bild[4].src = "bild_copy60.png";
Bild[5] = new Image();
Bild[5].src = "bild_copy70.png";
Bild[6] = new Image();
Bild[6].src = "bild_copy80.png";
Bild[7] = new Image();
Bild[7].src = "bild_copy90.png";
Bild[8] = new Image();
Bild[8].src = "bild_copy100.png";var i = 0;
function Bild() {
for (var b = 0; b < Bild.length; ++b)
window.setInterval("Bildwechsel(Bild[b])", 1000);
i + 1;
}
</script>
</head><body>
<div id="bild">
<img src="bild_copy10.png" alt="" width="1000" height="125" border="0">
</div>
</body>
</html>
#################################################################
Vielen vielen Dank für deine Antwort! Ich bin sehr dankbar!
greetz Tobi-
hi,
for (var b = 0; b < Bild.length; ++b)
window.setInterval("Bildwechsel(Bild[b])", 1000);Ist dir klar, was setInterval macht?
gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; }-
Hi!
Also ich denke, dass setInterval eine Funktion aufruft, in dem vorgegebenen Intervall, oder? Täusche ich mich? Was wäre eine Lösung?
Vielen Dank!
greetz Tobi-
hi,
Also ich denke, dass setInterval eine Funktion aufruft, in dem vorgegebenen Intervall, oder?
Und Intervall bedeutet ...?
Genau, mehrmals hintereinander - in diesem Falle sogar so lange, bis du es irgendwann wieder stoppst.
Da deine Tauschaktion durch Erstellung eines solchen Intervalls also sowie bereits mehrfach ausgeführt wird, ist es doch unsinnig, dies dann noch mal für jedes einzelne Bild machen zu wollen - da bekommst du ja x Intervalle, die dann alle parallel in die Unendlichkeit galoppieren.
Deshalb noch mal der Tipp:
Variablen nicht beim Aufruf über setInterval mitgeben, sondern _global_ machen.gruß,
wahsaga--
/voodoo.css:
#GeorgeWBush { position:absolute; bottom:-6ft; } -
Hallo Tobi ,
hier mal ein Beispiel, wie mit setInterval eine Funktion immer wieder aufgerufen wird, die eine Globale Variable erhöht und anzeigt:
var i=0; // eine globale Variable function tuwas() { alert(i); i++; } window.setInterval("tuwas()",2000); // tuwas() wird jetzt alle 2000 ms aufgerufen, bis die Seite verlassen wird.Gruß, Jürgen
-
Hi!
Danke für eure Antworten! Ich hab dir das jetzt zu Herzen genommen und habs trotzdem wieder falsch gemacht. Aber was? Die JS-Konsole schweigt...
#################################################################
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>
<head>
<title>Bild</title>
<link rel="STYLESHEET" type="text/css" href="css.css">
<script type="text/javascript">
var Bild = new Array();
Bild[0] = new Image();
Bild[0].src = "bild_copy20.png";
Bild[1] = new Image();
Bild[1].src = "bild_copy30.png";
Bild[2] = new Image();
Bild[2].src = "bild_copy40.png";
Bild[3] = new Image();
Bild[3].src = "bild_copy50.png";
Bild[4] = new Image();
Bild[4].src = "bild_copy60.png";
Bild[5] = new Image();
Bild[5].src = "bild_copy70.png";
Bild[6] = new Image();
Bild[6].src = "bild_copy80.png";
Bild[7] = new Image();
Bild[7].src = "bild_copy90.png";
Bild[8] = new Image();
Bild[8].src = "bild_copy100.png";var i = 0;
function Bilder() {
Bild[i];
i++;
}
window.setInterval("Bilder()",1000);
</script>
</head><body>
<div id="bild">
<img src="bild_copy10.png" alt="" width="1000" height="125" border="0">
</div>
</body>
</html>
#################################################################
Vielen Dank für euer bemühen!
greetz Tobi-
Danke für eure Antworten! Ich hab dir das jetzt zu Herzen genommen und habs trotzdem wieder falsch gemacht. Aber was? Die JS-Konsole schweigt...
nö nicht falsch, sondern was vergessen.
var i = 0;
function Bilder() {
Bild[i];
i++;
}Was soll denn hier deiner Meinung alles passieren?
Struppi.
--
Javascript ist toll (Perl auch!)-
Hi!
Ich denke folgendes passiert dort:var i = 0; //Globalvariable wird definiert
function Bilder() { //Funktion wird definiert
Bild[i]; //Der Array Bild[0] wird aufgerufen
i++; //Variable wird um 1 erhöht, damit nachher der Array Bild[1] aufgerufen wird
}Falsch? Was denke ich falsch?
Vielen Dank!
greetz Tobi-
Hallo Tobi ,
Bild[i]; //Der Array Bild[0] wird aufgerufen
fast. Bild[i] wird nicht aufgerufen, sondern nur gerufen. Bild[i] ist eine Variable bzw. ein Arrayelement, kein Befehl.
Du willst aber, das der Source des Bildes auf Bild[i].src gesetzt wird. Du solltest dir mal den Unterschied zwischen:
5;
und
x=5;klarmachen.
Gruß, Jürgen
-
Hi!
Du solltest dir mal den Unterschied zwischen:
5;
und
x=5;klarmachen.
Soll das heißen, dass ich den Array in eine Variable schreiben soll? Und wie soll ich dann diese Variable aufrufen? Beim Ausgeben von Text oder so wüsste ich, wie ich es machen muss, aber hier stehe ich wirklich auf dem Schlauch.
Vielen Dank!
greetz Tobi-
Hallo Tobi ,
Soll das heißen, dass ich den Array in eine Variable schreiben soll? ...
nein. Du sollst dir nur klarmachen, dass "Bild[i];" genaugenommen nichts macht. Was du brauchst, ist so etwas wie
window.document.images[Nummer_des_Bildes].src = Bild[i].src;
oder
document.getElementById("ID_des_Bildes").src = Bild[i].src;
So wird dem Bild die entsprechende Source zugewiesen.
Gruß, Jürgen
-
Hi!
Vielen Dank an wahsaga, JürgenB und Struppi! Ihr habt mich glücklich gemacht! :-)
Vielen Dank!
greetz Tobi -
window.document.images[Nummer_des_Bildes].src = Bild[i].src;
oder
document.getElementById("ID_des_Bildes").src = Bild[i].src;
oder
window.document.images['name_des_bildes']
Struppi.
--
Javascript ist toll (Perl auch!)
-
-
-
-
Ich denke folgendes passiert dort:
var i = 0; //Globalvariable wird definiert
Ja.
function Bilder() { //Funktion wird definiert
Ja.
Bild[i]; //Der Array Bild[0] wird aufgerufen
Wie aufgerufen? Irgendwie stimmt das, aber du machst mit Bild[i] nichts.
Du möchtest die Quelle von diesem Bildobjekt einem anderen im HTML code vorhandenen Bild zuweisen, dass tust du auf jeden Fall nicht.i++; //Variable wird um 1 erhöht, damit nachher der Array Bild[1] aufgerufen wird
ja.
Struppi.
--
Javascript ist toll (Perl auch!)
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-