foto's automatisch verwisselen
alvast bedankt
of
Code (php)
Foto,s op volgorde weergeven wordt wat lastiger omdat je dan ergens moet gaan opslaan wat de huidige foto is. Misschien dat je dit in een PHP sessie kan zetten.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?
//stukje actionscript 2.0
var totalSlides:Number = 5;
var currentImage:Number = 0;
var imagePath:String = "images/sunset_";
var imageName:String = "Arizona Sunset";
var imageExt:String = ".jpg";
var myMCL:MovieClipLoader = new MovieClipLoader();
function loadslide(){
myMCL.loadClip(imagePath + currentImage + imageExt, "container_mc");
}
loadslide();
//dit was het relefante deel...
?>
//stukje actionscript 2.0
var totalSlides:Number = 5;
var currentImage:Number = 0;
var imagePath:String = "images/sunset_";
var imageName:String = "Arizona Sunset";
var imageExt:String = ".jpg";
var myMCL:MovieClipLoader = new MovieClipLoader();
function loadslide(){
myMCL.loadClip(imagePath + currentImage + imageExt, "container_mc");
}
loadslide();
//dit was het relefante deel...
?>
maar dan zonder php tags, die zijn alleen voor de kleur :)
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php
<script type="text/javascript">
var array = new Array();
array[] = 'path/naar/foto1.png';
array[] = 'path/naar/foto2.png';
array[] = 'enz.png';
var numb = 0;
var aantal = aantal_fotos-1; //het aantal_foto's moet je nog ff zelf neerzetten!
function changePic()
{
if(numb < aantal)
document.getElementById('foto').src = array[numb];
else
{
document.getElementById('foto').src = array[0];
numb = 0;
}
numb++;
setTimeOut("changePic", 10000); //het cijfer mag je aanpassen, ligt eraan hoelang je het wilt ;)
}
</script>
?>
<script type="text/javascript">
var array = new Array();
array[] = 'path/naar/foto1.png';
array[] = 'path/naar/foto2.png';
array[] = 'enz.png';
var numb = 0;
var aantal = aantal_fotos-1; //het aantal_foto's moet je nog ff zelf neerzetten!
function changePic()
{
if(numb < aantal)
document.getElementById('foto').src = array[numb];
else
{
document.getElementById('foto').src = array[0];
numb = 0;
}
numb++;
setTimeOut("changePic", 10000); //het cijfer mag je aanpassen, ligt eraan hoelang je het wilt ;)
}
</script>
?>
en dan als html (weer php tags voor kleur)
Code (php)
1
2
3
2
3
<?php
<img src="imageLaden.png" id="foto" alt="mijn foto's" />
?>
<img src="imageLaden.png" id="foto" alt="mijn foto's" />
?>
gr. leroy
edit timer toegevoegd :D
edit2 is btw niet getest ;)
Gewijzigd op 01/01/1970 01:00:00 door Leroy Boerefijn
Edit:
$ bij array weggehaald, ik dacht even niet goed na...
$ bij array weggehaald, ik dacht even niet goed na...
Gewijzigd op 01/01/1970 01:00:00 door Mark L
Miloan schreef op 20.08.2007 19:17:
En met het scriptje van Leroy zou je de $array kunnen vullen d.m.v. PHP :D
idd! (alleen is het array zonder $ ;) )
je kunt bijv. via php de bestanden uitlezen en dan dus die array kunnen vullen zoals miloan zegt ;)
edit en dan kun je natuurlijk gelijk het aantal foto's invullen ;)
edit 1 voor het uitlezen van je foto's zou je http://www.phphulp.nl/php/scripts/7/171/ kunnen gebruiken ;)
Gewijzigd op 01/01/1970 01:00:00 door Leroy Boerefijn
Code (php)
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
41
42
43
44
45
46
47
48
49
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
41
42
43
44
45
46
47
48
49
<?php
?>
<html>
<head>
<link rel=StyleSheet type="text/css" href="stylesheet.css"></style>
<script type="text/javascript">
var array = new Array();
array[] = 'image/foto/1.jpg';
array[] = 'image/foto/2.jpg';
array[] = 'image/foto/3.jpg';
array[] = 'image/foto/4.jpg';
var numb = 0;
var aantal = 3; //het aantal_foto's moet je nog ff zelf neerzetten!
function changePic()
{
if(numb < aantal)
document.getElementById('foto').src = array[numb];
else
{
document.getElementById('foto').src = array[0];
numb = 0;
}
numb++;
setTimeOut("changePic", 10000); //het cijfer mag je aanpassen, ligt eraan hoelang je het wilt ;)
}
</script>
<title>test</title>
</head>
<body>
<div class="hoofdvak">
<div class="1"><img width=360 height=120 src="image/2.jpg" alt="test"></div>
<div class="menu">
<a href="test.php"><img src="image/1.jpg"></a>
<a href="test.php"><img src="image/2.jpg"></a>
<a href="test.php"><img src="image/3.jpg"></a>
<a href="test.php"><img src="image/4.jpg"></a>
</div>
</div>
<div class="fotovak">
<img src="imageLaden.jpg" id="foto" alt="mijn foto's" />
</div>
</body></html>
?>
<html>
<head>
<link rel=StyleSheet type="text/css" href="stylesheet.css"></style>
<script type="text/javascript">
var array = new Array();
array[] = 'image/foto/1.jpg';
array[] = 'image/foto/2.jpg';
array[] = 'image/foto/3.jpg';
array[] = 'image/foto/4.jpg';
var numb = 0;
var aantal = 3; //het aantal_foto's moet je nog ff zelf neerzetten!
function changePic()
{
if(numb < aantal)
document.getElementById('foto').src = array[numb];
else
{
document.getElementById('foto').src = array[0];
numb = 0;
}
numb++;
setTimeOut("changePic", 10000); //het cijfer mag je aanpassen, ligt eraan hoelang je het wilt ;)
}
</script>
<title>test</title>
</head>
<body>
<div class="hoofdvak">
<div class="1"><img width=360 height=120 src="image/2.jpg" alt="test"></div>
<div class="menu">
<a href="test.php"><img src="image/1.jpg"></a>
<a href="test.php"><img src="image/2.jpg"></a>
<a href="test.php"><img src="image/3.jpg"></a>
<a href="test.php"><img src="image/4.jpg"></a>
</div>
</div>
<div class="fotovak">
<img src="imageLaden.jpg" id="foto" alt="mijn foto's" />
</div>
</body></html>
maar ik krijg het niet voor elkaar om de foto's te zien
Gewijzigd op 02/12/2011 11:00:23 door arend b
http://localhost/jelmer/imageLaden.jpgFailed to load resource: the server responded with a status of 404 (Not Found)
ik geloof dat de fout hier in zit maar weet niet hoe ik dit kan oplossen:
<img src="imageLaden.jpg" id="foto" alt="mijn foto's" />
volgens mij moet de src een variable.jpg zijn
Gewijzigd op 02/12/2011 11:56:42 door arend b
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<? //voor de kleurtjes
var imgArray = new Array('1.png','2.png', '3.png'); //etc.
var curPos = 0;
function imgRotate() {
if (curPos < imgArray.length - 1)
curPos += 1;
else curPos = 0;
if (typeof imgArray[curPos] == 'string')
imgArray[curPos] = CacheImage(imgArray[curPos]);
document.getElementsById['foto'].src = imgArray[curPos];
}
function CacheImage(src) {
var imgObj = new Image();
imgObj.src = '/image/foto/' + src;
return imgObj;
}
?>
var imgArray = new Array('1.png','2.png', '3.png'); //etc.
var curPos = 0;
function imgRotate() {
if (curPos < imgArray.length - 1)
curPos += 1;
else curPos = 0;
if (typeof imgArray[curPos] == 'string')
imgArray[curPos] = CacheImage(imgArray[curPos]);
document.getElementsById['foto'].src = imgArray[curPos];
}
function CacheImage(src) {
var imgObj = new Image();
imgObj.src = '/image/foto/' + src;
return imgObj;
}
?>
Gewijzigd op 02/12/2011 12:17:46 door Ger van Steenderen
Code (php)
1
2
3
2
3
<? //voor de kleur
<img id="foto" src="" alt="mijn foto's" />
?>
<img id="foto" src="" alt="mijn foto's" />
?>
hoe krijg ik de src geladen?
regel 10 in mijn code moet zijn:
document.getElementsById['foto'].src = imgArray[curPos].src;
bestaat de foto?
Ik gebruik deze methode regelmatig zonder problemen.
Code (php)
1
2
3
2
3
<? voor kleurtje
<img src="imageLaden.jpg" id="foto" alt="mijn foto's" />
?>
<img src="imageLaden.jpg" id="foto" alt="mijn foto's" />
?>
imageladen.jpg in vul dan zie je in de fout melding dat hij zoekt in image/foto/ naar imageladen.jpg. ik vind het ook raar dat hij niet laad want volgens mij moet hij gewoon via de id de src kunnen laden
Code (php)
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
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 language="JavaScript">
<!--
function imgArray() {
for (i=0; i*2<imgArray.arguments.length; i++) {
this[i] = new Object();
this[i].src = imgArray.arguments[i*2];
this[i].href = imgArray.arguments[i*2+1];
}
this.length = i;
}
function getimgNum() {
dat = new Date();
dat = (dat.getTime()+"").charAt(8);
if (dat.length == 1)
img_num = dat%img.length;
else
img_num = 0;
return img_num;
}
var img = new imgArray(
"1.png","http://test.nl",
"2.png","http://test1.nl",
"3.png","");
var img_num = getimgNum();
document.write('<a href="'+img[img_num].href+'"><img src="'+img[img_num].src+'" name="js_img"></a>');
link_num = document.links.length-1;
function rotateimg() {
if (document.images) {
img_num = (img_num+1)%img.length;
document.js_img.src = img[img_num].src;
document.links[link_num].href = img[img_num].href;
setTimeout("rotateimg()",5000);
}
}
setTimeout("rotateimg()",5000);
// -->
</script>
<!--
function imgArray() {
for (i=0; i*2<imgArray.arguments.length; i++) {
this[i] = new Object();
this[i].src = imgArray.arguments[i*2];
this[i].href = imgArray.arguments[i*2+1];
}
this.length = i;
}
function getimgNum() {
dat = new Date();
dat = (dat.getTime()+"").charAt(8);
if (dat.length == 1)
img_num = dat%img.length;
else
img_num = 0;
return img_num;
}
var img = new imgArray(
"1.png","http://test.nl",
"2.png","http://test1.nl",
"3.png","");
var img_num = getimgNum();
document.write('<a href="'+img[img_num].href+'"><img src="'+img[img_num].src+'" name="js_img"></a>');
link_num = document.links.length-1;
function rotateimg() {
if (document.images) {
img_num = (img_num+1)%img.length;
document.js_img.src = img[img_num].src;
document.links[link_num].href = img[img_num].href;
setTimeout("rotateimg()",5000);
}
}
setTimeout("rotateimg()",5000);
// -->
</script>
Code (php)
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
41
42
43
44
45
46
47
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
41
42
43
44
45
46
47
<?php
<html>
<head>
<link rel=StyleSheet type="text/css" href="stylesheet.css"></style>
<script type="text/javascript">
var imgArray = new Array('1.jpg','2.jpg', '3.jpg'); //etc.
var curPos = 0;
function CacheImage(src) {
var imgObj = new Image();
imgObj.src = '/image/foto/' + src;
return imgObj;
}
function imgRotate() {
if (curPos < imgArray.length - 1)
curPos += 1;
else curPos = 0;
if (typeof imgArray[curPos] == 'string')
imgArray[curPos] = CacheImage(imgArray[curPos]);
document.getElementsById['foto'].src = imgArray[curPos].src;
}
</script>
<title>test</title>
</head>
<body>
<div class="hoofdvak">
<div class="1"><img width=360 height=120 src="image/2.jpg" alt="test"></div>
<div class="menu">
<a href="test.php">Home</a>
<a href="test.php">Contact</a>
<a href="test.php">Foto</a>
<a href="test.php">Over</a>
</div>
</div>
<div class="fotovak">
<img id="foto" src="" alt="mijn foto's" />
</div>
</body></html>
?>
<html>
<head>
<link rel=StyleSheet type="text/css" href="stylesheet.css"></style>
<script type="text/javascript">
var imgArray = new Array('1.jpg','2.jpg', '3.jpg'); //etc.
var curPos = 0;
function CacheImage(src) {
var imgObj = new Image();
imgObj.src = '/image/foto/' + src;
return imgObj;
}
function imgRotate() {
if (curPos < imgArray.length - 1)
curPos += 1;
else curPos = 0;
if (typeof imgArray[curPos] == 'string')
imgArray[curPos] = CacheImage(imgArray[curPos]);
document.getElementsById['foto'].src = imgArray[curPos].src;
}
</script>
<title>test</title>
</head>
<body>
<div class="hoofdvak">
<div class="1"><img width=360 height=120 src="image/2.jpg" alt="test"></div>
<div class="menu">
<a href="test.php">Home</a>
<a href="test.php">Contact</a>
<a href="test.php">Foto</a>
<a href="test.php">Over</a>
</div>
</div>
<div class="fotovak">
<img id="foto" src="" alt="mijn foto's" />
</div>
</body></html>
?>
dit is de code die ik nu gebruik
Gewijzigd op 04/12/2011 12:44:36 door arend b
Code (php)
1
<body onload="javascript:setTimeout(imgRotate(), 5000)">
Gewijzigd op 04/12/2011 13:04:25 door Ger van Steenderen
edit: ik krijg wel een foutmelding:
Uncaught ReferenceError: setTimeOut is not defined
bedankt voor al je hulp tot nu toe
Gewijzigd op 04/12/2011 13:20:21 door arend b
Dit topic is gesloten.