Lid |
|
Hallo,
Ik kan nog nix van Java en daarom moet ik het doen met scripts die door andere mensen zijn gemaakt en daarom heb ik nooit echt precies wat ik wil.
Ik heb 2 scripts die allebij een diashow afspelen.
De een is met beschrijving en kan ik ook makkelijk zo bewerken dat ik de plaatjes uit een mysql table kan halen.
De ander geeft een "flash" effect als hij van plaatje verwisseld.
Hier staat het script dat ik makkelijk kan bewerken en dat een beschrijving bij het plaatje geeft:
<p align="center"><input type="button" id="btnPrev" value="<< Previous" onclick="Prev();"> <input type="button" id="bntPlay" value="Play - Stop" onclick="Play()"> <input type="button" id="btnNext" value=" Next >> " onclick="Next();"></p>
<p align="center"><img id="_Ath_Slide" onload="OnImgLoad()"> </p>
<p align="center"><b></b> <SPAN id="_Ath_FileName"> </SPAN> <br>
<b>foto <SPAN id="_Ath_Img_X"></SPAN> van de <SPAN id="_Ath_Img_N"></SPAN></b></p>
<p align="center">
<script language="JavaScript1.2">
/*
Interactive Image slideshow with text description
By Christian Carlessi Salvadó (cocolinks@c.net.gt). Keep this notice intact.
Visit http://www.dynamicdrive.com for script
*/
g_fPlayMode = 0;
g_iimg = -1;
g_imax = 0;
g_ImageTable = new Array();
function ChangeImage(fFwd)
{
if (fFwd)
{
if (++g_iimg==g_imax)
g_iimg=0;
}
else
{
if (g_iimg==0)
g_iimg=g_imax;
g_iimg--;
}
Update();
}
function getobject(obj){
if (document.getElementById)
return document.getElementById(obj)
else if (document.all)
return document.all[obj]
}
function Update(){
getobject("_Ath_Slide").src = g_ImageTable[g_iimg][0];
getobject("_Ath_FileName").innerHTML = g_ImageTable[g_iimg][1];
getobject("_Ath_Img_X").innerHTML = g_iimg + 1;
getobject("_Ath_Img_N").innerHTML = g_imax;
}
function Play()
{
g_fPlayMode = !g_fPlayMode;
if (g_fPlayMode)
{
getobject("btnPrev").disabled = getobject("btnNext").disabled = true;
Next();
}
else
{
getobject("btnPrev").disabled = getobject("btnNext").disabled = false;
}
}
function OnImgLoad()
{
if (g_fPlayMode)
window.setTimeout("Tick()", g_dwTimeOutSec*1000);
}
function Tick()
{
if (g_fPlayMode)
Next();
}
function Prev()
{
ChangeImage(false);
}
function Next()
{
ChangeImage(true);
}
////configure below variables/////////////////////////////
//configure the below images and description to your own.
g_ImageTable[g_imax++] = new Array ("foto1.jpg", "beschrijving1");
g_ImageTable[g_imax++] = new Array ("foto2.jpg", "beschrijving2");
g_ImageTable[g_imax++] = new Array ("foto3.jpg", "beschrijving3");
g_ImageTable[g_imax++] = new Array ("foto4.jpg", "beschrijving4");
g_ImageTable[g_imax++] = new Array ("foto5.jpg", "beschrijving5");
//extend the above list as desired
g_dwTimeOutSec=2
////End configuration/////////////////////////////
if (document.getElementById||document.all)
window.onload=Play
</script>
</p>
<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br>
<a href="http://dynamicdrive.com">Dynamic Drive</a></font></p>
<p align="center"><font face="Arial" size="-2">
</font></p>
<p align="center"><input type="button" id="btnPrev" value="<< Previous" onclick="Prev();"> <input type="button" id="bntPlay" value="Play - Stop" onclick="Play()"> <input type="button" id="btnNext" value=" Next >> " onclick="Next();"></p> <p align="center"><img id="_Ath_Slide" onload="OnImgLoad()"> </p> <p align="center"><b></b> <SPAN id="_Ath_FileName"> </SPAN> <br> <b>foto <SPAN id="_Ath_Img_X"></SPAN> van de <SPAN id="_Ath_Img_N"></SPAN></b></p> <p align="center"> <script language="JavaScript1.2"> /* Interactive Image slideshow with text description By Christian Carlessi Salvadó (cocolinks@c.net.gt). Keep this notice intact. Visit http://www.dynamicdrive.com for script */ g_fPlayMode = 0; g_iimg = -1; g_imax = 0; g_ImageTable = new Array(); function ChangeImage(fFwd) { if (fFwd) { if (++g_iimg==g_imax) g_iimg=0; } else { if (g_iimg==0) g_iimg=g_imax; g_iimg--; } Update(); } function getobject(obj){ if (document.getElementById) return document.getElementById(obj) else if (document.all) return document.all[obj] } function Update(){ getobject("_Ath_Slide").src = g_ImageTable[g_iimg][0]; getobject("_Ath_FileName").innerHTML = g_ImageTable[g_iimg][1]; getobject("_Ath_Img_X").innerHTML = g_iimg + 1; getobject("_Ath_Img_N").innerHTML = g_imax; } function Play() { g_fPlayMode = !g_fPlayMode; if (g_fPlayMode) { getobject("btnPrev").disabled = getobject("btnNext").disabled = true; } else { getobject("btnPrev").disabled = getobject("btnNext").disabled = false; } } function OnImgLoad() { if (g_fPlayMode) window.setTimeout("Tick()", g_dwTimeOutSec*1000); } function Tick() { if (g_fPlayMode) } { ChangeImage(false); } { ChangeImage(true); } ////configure below variables///////////////////////////// //configure the below images and description to your own. g_ImageTable [g_imax ++] = new Array ("foto1.jpg", "beschrijving1");g_ImageTable [g_imax ++] = new Array ("foto2.jpg", "beschrijving2");g_ImageTable [g_imax ++] = new Array ("foto3.jpg", "beschrijving3");g_ImageTable [g_imax ++] = new Array ("foto4.jpg", "beschrijving4");g_ImageTable [g_imax ++] = new Array ("foto5.jpg", "beschrijving5");//extend the above list as desired g_dwTimeOutSec=2 ////End configuration///////////////////////////// if (document.getElementById||document.all) window.onload=Play </script> </p> <p align="center"><font face="Arial" size="-2">Free DHTML scripts provided by<br> <a href="http://dynamicdrive.com">Dynamic Drive</a></font></p> <p align="center"><font face="Arial" size="-2"> </font></p>
En dit is het script dat het "flash" effect geeft (het komt van leejoo.nl):
<head>
<script language="JavaScript1.1">
//voorladen van de plaatjes
var foto1=new Image()
foto1.src="foto1.jpg"// foto 1
var foto2=new Image()
foto2.src="foto2.jpg"// foto 2
var foto3=new Image()
foto3.src="foto3.jpg"// foto 3
var foto4=new Image()
foto4.src="foto4.jpg"// foto 4
var foto5=new Image()
foto5.src="foto5.jpg"// foto 5
</script>
</head>
<body onLoad="overvloeier()">
<a href="javascript:overgang()"><img src="foto1.jpg" name="slide" border=0 style="filter:blendTrans(duration=3)"></a>
</center>
<script>
var stap=1
var beeldnr=1
function overvloeier(){
if (!document.images)
return
if (document.all)
slide.filters.blendTrans.apply()
document.images.slide.src=eval("foto"+stap+".src")
if (document.all)
slide.filters.blendTrans.play()
beeldnr=stap
if (stap<5)// aanpassen aan aantal plaatjes
stap++
else
stap=1
setTimeout("overvloeier()",4000)// de tijd tussen twee plaatjes in milliseconden
}
function overgang(){
if (beeldnr==1)
window.location="http://www.leejoo.nl"
else if (beeldnr==2)
window.location="http://www.leejoo.nl"
else if (beeldnr==3)
window.location="http://www.leejoo.nl"
else if (beeldnr==4)
window.location="http://www.leejoo.nl"
else if (beeldnr==5)
window.location="http://www.leejoo.nl" // bij meer foto's gewoon doornummeren
}
</script>
</body>
<head> <script language="JavaScript1.1"> //voorladen van de plaatjes var foto1=new Image() foto1.src="foto1.jpg"// foto 1 var foto2=new Image() foto2.src="foto2.jpg"// foto 2 var foto3=new Image() foto3.src="foto3.jpg"// foto 3 var foto4=new Image() foto4.src="foto4.jpg"// foto 4 var foto5=new Image() foto5.src="foto5.jpg"// foto 5 </script> </head> <body onLoad="overvloeier()"> <a href="javascript:overgang()"><img src="foto1.jpg" name="slide" border=0 style="filter:blendTrans(duration=3)"></a> </center> <script> var stap=1 var beeldnr=1 function overvloeier(){ if (!document.images) return if (document.all) slide.filters.blendTrans.apply() document .images .slide .src =eval("foto"+stap +".src")if (document.all) slide.filters.blendTrans.play() beeldnr=stap if (stap<5)// aanpassen aan aantal plaatjes stap++ else stap=1 setTimeout("overvloeier()",4000)// de tijd tussen twee plaatjes in milliseconden } function overgang(){ if (beeldnr==1) window.location="http://www.leejoo.nl" else if (beeldnr==2) window.location="http://www.leejoo.nl" else if (beeldnr==3) window.location="http://www.leejoo.nl" else if (beeldnr==4) window.location="http://www.leejoo.nl" else if (beeldnr==5) window.location="http://www.leejoo.nl" // bij meer foto's gewoon doornummeren } </script> </body>
Omdat ik eerst niet werd geholpen heb ik nu al best lang naar het script zitten staren...
Ik ben er nu achter gekomen dat
style="filter:blendTrans(duration=3)" (regel 17 2e script)
het effect is en dat
slide.filters.blendTrans.apply() (regel 26 2e script)
en/of
slide.filters.blendTrans.play() (regel 29 2e script)
het effect activeren op de momenten wanneer het nodig is.
(ik weet het niet zeker, ik "spreek" geen woord javascript:p)
Maar ik heb geen iedee waar die stukken script in het eertse script moeten komen om het effect ook in dat script te laten werken.
Dus zou iemand het op de juiste plaatsen willen stoppen?:)
Greetz
|