Just nu i M3-nätverket
Jump to content

Bildspel


Hemmagossen

Recommended Posts

Jag håller på att göra ett bildspel i Javascript, och till den vill jag ha en knapp som pausar om man bildspelet är igång, och fortsätter om bildspelet är pausat.

 

Funktionen ser ut så här:

 

function knapp() {

if (t = setTimeout('runSlideShow()', slideShowSpeed)) {

clearTimeout(t);

}

 

else {

setTimeout('runSlideShow()', slideShowSpeed);

}

}

 

 

Innan hade två knappar (utan if-sats) och då fungerade det, men jag tycker att det blir snyggare om jag bara har en knapp.

Snälla, vad gör jag för fel?

 

Link to comment
Share on other sites

Lite funderingar ang din kod:

 

Vet du vad setTimeout() innebär?

Var lägger du in ett värde i variabeln t?

 

När du funderat lite på frågorna kan du kika på ex jag gjorde:

[log]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="sv" xml:lang="sv">
<head>
<meta http-equiv="Content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Language" content="sv" />
<title>Untitled</title>
<script type="text/javascript">
var i=0;
slideShowSpeed=100;
TmpBln=false;
function knapp() {
if (TmpBln) {
	clearInterval(t);
	TmpBln=false;
	return "Start";
}
else {
	t=setInterval("runSlideShow()",slideShowSpeed);
	TmpBln=true;
	return "Stopp";
} 
}
function runSlideShow() {
i++;
document.getElementById("siffra").value=i;
}
</script>
</head>

<body>
<input type="Text" id="siffra" /><br />
<input type="Button" onclick="this.value=knapp();" value="Start" />
</body>
</html>

[/log]

[inlägget ändrat 2008-10-17 17:48:56 av Micke_skane]

Link to comment
Share on other sites

Hela koden ser ut så här:

<head>

<script language="JavaScript">
<!--


var slideShowSpeed = 4000;

var crossFadeDuration = 3;
rugbynollsju = new Array();
rugbynollsju[0]='materialare.GIF';
rugbynollsju[1]='oljefatansvarig.gif';
rugbynollsju[2]='ordforande.gif';
rugbynollsju[3]='taktansvarig.gif';
rugbynollsju[4]='vice.gif';
var t
var j = 0
var p = rugbynollsju.length
var preLoad = new Array()
for (i = 0; i < p; i++){
  preLoad[i] = new Image()
  preLoad[i].src = rugbynollsju[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)
}

function knapp() {
if (t = setTimeout('runSlideShow()', slideShowSpeed)) {
	clearTimeout(t);
}

else {
setTimeout('runSlideShow()', slideShowSpeed);
} 
}

//-->
</script>

</head>

 

 

Jag är bara nybörjare i Javascript, och har fått en del hjälp med den här koden, men setTimeout() betyder är väl hur lång tid det tar innan funktion börjar, i det här fallet byts bilden efter 4000 millisekunder. t har jag lagt in ett värde för tidigare i skriptet som du ser.

 

 

Som jag skrev innan så är jag nybörjare, så jag förstår inte ditt skript. :S

Kan du förklara. (a)

 

[inlägget ändrat 2008-10-18 16:26:00 av Hemmagossen]

[inlägget ändrat 2008-10-18 16:26:40 av Hemmagossen]

Link to comment
Share on other sites

Ändra funktionen till

function knapp() {
  if (t != null)
  { 
clearTimeout(t);
       t=null;
  }
  else 
  {
t=setTimeout('runSlideShow()', slideShowSpeed);
  }
} 
}

 

Link to comment
Share on other sites

  • 2 weeks later...

Och för att förklara varför det inte funkade innan och varför det funkar nu, snarare än bara få lösningen serverad på ett fat:

 

var v = setTimeout(f, t) gör så att funktionen f evalueras efter t millisekunder.

värdet v som setTimeout är en _handler_ för timern. den använder du för att kunna hantera timern - i det här stänga av den.

clearTimeout tar alltså en handler till en timer som argument och gör helt sonika så att funktionen f inte längre anropas efter att tiden t förlöpt.

 

I ditt exempel kör du if (t = setTimeout(...)) { ... }.

vad som händer är ekvivalent med:

 

t = setTimeout(...);

if (t) { clearTimeout(t); }

 

dvs, eftersom t alltid kommer va handlern till timern du precis satte igång, kommer t alltid evalueras till true. resultatet blir alltså att du startar timern, och sen stänger av timern direkt.

i det fungerande exemplet kollas det istället först om timern körs (dvs om din slideshow är igång) och avslutar isf timern (och sättern handlern till null). om timern inte körs (din slideshow är pausad) så startas timern igen.

 

Jag hoppas du läser förklaringen och inte lämnar forumet så fort du fick din kod fungerande :). Inte annat kanske någon annan får nytta av det.

I övriga ärenden kan jag dock rekommendera Google (http://www.google.com).

 

 

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.



×
×
  • Create New...