Home | Registrieren | Einloggen | Suchen | Aktuelles


Forum » Auszeichnungssprachen » javascript bilderwechsel problem Antworten
javascript bilderwechsel problem

Jamil
Quasselstrippe


Beiträge: 273


ich hab ein script, das in bestimmten abständen bestimmte bilder wechselt. das bild wird im div angezeigt. das sind sehr kleine bilder, die dann nebeneinander gestellt werden sollen, wie tapeteneffekt. wie z.b.:

1:
<body background="bild1.jpg">


wisst ihr wie man das bei diesem js realisieren kann?

1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
18: 
19: 
20: 
21: 
22: 
23: 
24: 
25: 
26: 
27: 
28: 
29: 
30: 
31: 
32: 
33: 
34: 
35: 
36: 
37: 
38: 
39: 
40:
<script language="JavaScript" type="text/JavaScript">

var bilder = new Array(); 

bilder[0] = "Bilder/0.jpg"; 
bilder[1] = "Bilder/1.jpg"; 
bilder[2] = "Bilder/3.jpg"; 
bilder[3] = "Bilder/4.jpg";
bilder[4] = "Bilder/7.jpg";
bilder[5] = "Bilder/8.jpg";
bilder[6] = "Bilder/10.jpg";
bilder[7] = "Bilder/13.jpg";
bilder[8] = "Bilder/14.jpg";

var timer = 10000; <!--Millisekunden-->
var arraylaenge = bilder.length; 
var index = Math.floor(Math.random() * arraylaenge); 
var Bildstring = '<img src="' + bilder[index] + '">'; 

function Bildwechsel () { 
    if (index == arraylaenge-1) { 
                index = 0; 
    } else { 
            index++; 
    } 
    Bildstring = '<img src="' + bilder[index] + '">'; 
    document.all.Bild.innerHTML = Bildstring; 
    setTimeout("Bildwechsel()", timer); 
} 

function Bildanzeige () { 
    document.all.Bild.innerHTML = Bildstring; 
    Bildwechsel(); 
} 
</script>
<body onLoad="Bildanzeige()">
<div id=Bild>
</div>
</body>



  Profil   Website   Editieren   Zitieren

c3o
Posting-Schinder


Beiträge: 586


Formulier das mal ein bisschen klarer!
Willst du den Seitenhintergrund ändern, oder willst du dass sich in einem div das Bild kachelt, so wie sich zB ein Seitenhintergrund auch kachelt?

Seitenhintergrund
1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
18: 
19: 
20: 
21: 
22: 
23: 
24: 
25: 
26: 
27: 
28: 
29: 
30: 
31: 
32: 
33: 
34: 
35: 
36: 
37:
<script type="text/javascript">

var bilder = new Array(); 

bilder[0] = "Bilder/0.jpg"; 
bilder[1] = "Bilder/1.jpg"; 
bilder[2] = "Bilder/3.jpg"; 
bilder[3] = "Bilder/4.jpg";
bilder[4] = "Bilder/7.jpg";
bilder[5] = "Bilder/8.jpg";
bilder[6] = "Bilder/10.jpg";
bilder[7] = "Bilder/13.jpg";
bilder[8] = "Bilder/14.jpg";

var timer = 10000; <!--Millisekunden-->
var arraylaenge = bilder.length; 
var index = Math.floor(Math.random() * arraylaenge); 

function Bildwechsel () { 
    if (index == arraylaenge-1) { 
                index = 0; 
    } else { 
            index++; 
    } 
    document.body.style.backgroundImage = 'url("'+bilder[index]+'")'; 
    setTimeout("Bildwechsel()", timer); 
} 

function Bildanzeige () { 
     document.body.style.backgroundImage = 'url("'+bilder[index]+'")'; 
     Bildwechsel(); 
} 
</script>
<body onLoad="Bildanzeige()">
</body>



Gekachelt in div
1: 
2: 
3: 
4: 
5: 
6: 
7: 
8: 
9: 
10: 
11: 
12: 
13: 
14: 
15: 
16: 
17: 
18: 
19: 
20: 
21: 
22: 
23: 
24: 
25: 
26: 
27: 
28: 
29: 
30: 
31: 
32: 
33: 
34: 
35: 
36: 
37: 
38:
<script type="text/javascript">

var bilder = new Array(); 

bilder[0] = "Bilder/0.jpg"; 
bilder[1] = "Bilder/1.jpg"; 
bilder[2] = "Bilder/3.jpg"; 
bilder[3] = "Bilder/4.jpg";
bilder[4] = "Bilder/7.jpg";
bilder[5] = "Bilder/8.jpg";
bilder[6] = "Bilder/10.jpg";
bilder[7] = "Bilder/13.jpg";
bilder[8] = "Bilder/14.jpg";

var timer = 10000; <!--Millisekunden-->
var arraylaenge = bilder.length; 
var index = Math.floor(Math.random() * arraylaenge); 

function Bildwechsel () { 
    if (index == arraylaenge-1) { 
                index = 0; 
    } else { 
            index++; 
    } 
    document.getElementById('kachelndes_bild').style.backgroundImage = 'url("'+bilder[index]+'")'; 
    setTimeout("Bildwechsel()", timer); 
} 

function Bildanzeige () { 
     document.getElementById('kachelndes_bild').style.backgroundImage = 'url("'+bilder[index]+'")'; 
     Bildwechsel(); 
} 
</script>
<body onLoad="Bildanzeige()">
<div id="kachelndes_bild" style="width:300px;height:200px;"></div>
</body>

Diese Nachricht wurde geändert von: c3o
  Profil   E-Mail   Website   Editieren   Zitieren

Jamil
Quasselstrippe


Beiträge: 273


perfekt, ich meinte das als hintergrund, thnx!

  Profil   Website   Editieren   Zitieren

EviLCypress
Pixelschubser


Beiträge: 1


Hi...

mal eine Frage: wie sieht es aus, wenn ich die Bilder per Button wechseln möchte? Sprich ich habe einen Button "Weiter" und dann möchte ich, das per klick das nächste Bild angezeigt wird..

Wie muss man das umschreiben?


  Profil   Editieren   Zitieren

progrookie
Fachidiot


Beiträge: 119


1:
<input type="submit" value="Weiter" name="ButtonName" onclick="Bildanzeige();" />

müßte so gehen...

---

Diese Nachricht wurde geändert von: progrookie
  Profil   E-Mail   Website   Editieren   Zitieren
 

Antworten
Nach oben