diashow maken voor website
Zomaar even snel iets gemaakt, zoiets ?
http://pluis.netne.net/Pctuts/Michael_slideshow/index1.htm
of met een andere instelling http://pluis.netne.net/Pctuts/Michael_slideshow/index.htm
Heb even geduld, alles staat op een trage host geplaatst.
Ik ken studio webdesign 4 pro niet, kan je daarmee in de editor htm bewerken
http://pluis.netne.net/Pctuts/Michael_slideshow/index1.htm
of met een andere instelling http://pluis.netne.net/Pctuts/Michael_slideshow/index.htm
Heb even geduld, alles staat op een trage host geplaatst.
Ik ken studio webdesign 4 pro niet, kan je daarmee in de editor htm bewerken
Hey pluis,
ziet er goed uit.
ik denk wel dat je in de editor htm kan bewerken.
En hoe kan ik best starten ?
gr
ziet er goed uit.
ik denk wel dat je in de editor htm kan bewerken.
En hoe kan ik best starten ?
gr
OK, een webpagina heeft een head en een body.
<head>
Hier staat code
</head>
<body>
Hier staat code
</body>
Om te beginnen zorg je dat dit in de body staat.
Op de plaats waar 1.jpg staat, is bij mij de eerste afbeelding.
Natuurlijk kan deze bij jou een andere naam hebben.
Dus dit moet je even aanpassen.
Nu het gedeelte tussen de head.
Ik heb wat aanwijzingen in de code geplaatst.
Je kunt wat aanpassingen doen in het bovenste gedeelte van het script.
var slideShowSpeed = 5000 Als je hier 1000 van maakt, volgen de afbeeldingen sneller.
var crossFadeDuration = 6 Hiermee stel je de fade in en uit van de afbeeldingen in. Maak er maar eens 2 van.
Probeer eens met verschillende waarde wat jij mooi vind.
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Hier staan mijn afbeeldingen 1.jpg tot en met 4.jpg Maar natuurlijk zullen dit bij jouw andere namen zijn. Pas dit dus aan.
Ik heb een slideshow voor 4 afbeeldingen, maar dit mogen er natuurlijk meer zijn.
Dan moet je dit dus aanvullen met
Pic[4] = 'afbeelding.jpg'
Pic[5] = 'afbeelding.jpg'
Pic[6] = 'nog een afbeelding.jpg'
Kijk wel uit met te veel afbeeldingen dat de laadtijd van de pagina niet te groot wordt.
Ik weet zeker dat jou dit gaat lukken, ik voeg mijn slideshow toe als bijlage.
Als er problemen zijn moet je wachten tot de eerste week van september, omdat ik weg ben.
<head>
Hier staat code
</head>
<body>
Hier staat code
</body>
Om te beginnen zorg je dat dit in de body staat.
Op de plaats waar 1.jpg staat, is bij mij de eerste afbeelding.
Natuurlijk kan deze bij jou een andere naam hebben.
Dus dit moet je even aanpassen.
HTML:
<body onload="runSlideShow()">
<img src="1.jpg" name='SlideShow'>
</body>Nu het gedeelte tussen de head.
HTML:
<head>
<script>
// =======================================
// Hieronder mag je waarden aanpassen
// =======================================
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000
// Duration of crossfade (seconds)
var crossFadeDuration = 6
// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
// ============================================
// Verander hier onder niets
// ============================================
var t
var j = 0
var p = Pic.length
var preLoad = new Array()
for (i = 0; i < p; i++){
preLoad[i] = new Image()
preLoad[i].src = Pic[i]
}
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)
}
</script>
</head>Ik heb wat aanwijzingen in de code geplaatst.
Je kunt wat aanpassingen doen in het bovenste gedeelte van het script.
var slideShowSpeed = 5000 Als je hier 1000 van maakt, volgen de afbeeldingen sneller.
var crossFadeDuration = 6 Hiermee stel je de fade in en uit van de afbeeldingen in. Maak er maar eens 2 van.
Probeer eens met verschillende waarde wat jij mooi vind.
Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Hier staan mijn afbeeldingen 1.jpg tot en met 4.jpg Maar natuurlijk zullen dit bij jouw andere namen zijn. Pas dit dus aan.
Ik heb een slideshow voor 4 afbeeldingen, maar dit mogen er natuurlijk meer zijn.
Dan moet je dit dus aanvullen met
Pic[4] = 'afbeelding.jpg'
Pic[5] = 'afbeelding.jpg'
Pic[6] = 'nog een afbeelding.jpg'
Kijk wel uit met te veel afbeeldingen dat de laadtijd van de pagina niet te groot wordt.
Ik weet zeker dat jou dit gaat lukken, ik voeg mijn slideshow toe als bijlage.
Als er problemen zijn moet je wachten tot de eerste week van september, omdat ik weg ben.
ziet er goed uit.
ik heb nog 1 vraagje :
dus ik moet eerst al mijn foto's in mijn pagina plaatsen en dan moet ik deze code toepassen.
is dit correct ?
gr
ik heb nog 1 vraagje :
dus ik moet eerst al mijn foto's in mijn pagina plaatsen en dan moet ik deze code toepassen.
is dit correct ?
gr
Yep, dezelfde structuur zoals het in mijn rar bestand zit.
Je kunt wel met mappen gaan werken, doe dan het volgende.
Maak een map aan in de map waar het index bestand staat en noem deze Image
Verander de code in de body dan naar
<img src="Image/1.jpg" name='SlideShow'>
En verander bij de afbeeldingen de code naar
Pic[0] = 'Image/1.jpg'
Natuurlijk mag je hier ook een andere mapnaam maken, als je dan de code ook maar aanpast naar de juiste mapnaam.
Ook hiervan voeg ik een bijlage toe wat ik hier beschreven heb.
Je kunt wel met mappen gaan werken, doe dan het volgende.
Maak een map aan in de map waar het index bestand staat en noem deze Image
Verander de code in de body dan naar
<img src="Image/1.jpg" name='SlideShow'>
En verander bij de afbeeldingen de code naar
Pic[0] = 'Image/1.jpg'
Natuurlijk mag je hier ook een andere mapnaam maken, als je dan de code ook maar aanpast naar de juiste mapnaam.
Ook hiervan voeg ik een bijlage toe wat ik hier beschreven heb.
Ben net terug van vakantie, maar ben natuurlijk wel benieuwd of het gelukt is.
- Status