# Slideshow autoplay w/ controls

**URL:** <https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892>\
**Category:** Uncategorized\
**Created:** [November 7, 2003, 4:15pm UTC](https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892 "2003-11-07T16:15:15Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![riderchic88](https://avatars.discourse-cdn.com/v4/letter/r/77aa72/32.png) [@riderchic88](https://forum.kirupa.com/u/riderchic88)\
**Post date:** [November 7, 2003, 4:15pm UTC](https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892/1 "2003-11-07T16:15:15Z")

</div>

hey everyone. first of all, i just want to say, you guys are awesome!! :thumb:

anyways, i’ve tried to use this: [http://www.kirupaforum.com/forums/showthread.php?s=&threadid=11203&highlight=auto+gallery](http://www.kirupaforum.com/forums/showthread.php?s=&threadid=11203&highlight=auto+gallery)

i’m looking for a way to implement a play/pause button, so the slideshow could be totally user advanced.

and this is just a side thing, but is there a way to put random effects on each picture? like panning, zooming, etc. (you know, ken burns style :sure: ) maybe someone could point me in a direction… that’s my next big project hehe. :geek:

thanks!! :beam:

oh, here is my actionscript in case you wanted to take a look:

[AS]  
var absX = Stage.width/2;  
var absY = Stage.height/2;  
this.pathToPics = “”;  
this.pArray = [“1.jpg”, “2.jpg”, “3.jpg”, “4.jpg”, “5.jpg”, “6.jpg”, “7.jpg”, “8.jpg”, “9.jpg”, “10.jpg”];  
this.fadeSpeed = 20;  
this.pIndex = 0;  
//loading en setting x/y for first picture  
loadMovie(this.pathToPics+this.pArray[0], this.photo);  
this.photo.\_x = absX-180;//first picture = 360 width/2  
this.photo.\_y = absY-117.5;//first picture = 235 height/2  
MovieClip.prototype.changePhoto = function(d) {  
this.pIndex = (this.pIndex+d)%this.pArray.length;  
if (this.pIndex\<0) {  
this.pIndex += this.pArray.length;  
}  
this.onEnterFrame = fadeOut;  
};  
MovieClip.prototype.fadeOut = function() {  
if (this.photo.\_alpha\>this.fadeSpeed) {  
this.photo.\_alpha -= this.fadeSpeed;  
} else {  
this.loadPhoto();  
}  
};  
MovieClip.prototype.loadPhoto = function() {  
var p = this.photo;  
p.\_alpha = 0;  
p.loadMovie(this.pathToPics+this.pArray[this.pIndex]);  
this.onEnterFrame = loadMeter;  
};  
MovieClip.prototype.loadMeter = function() {  
var i, l, t;  
l = this.photo.getBytesLoaded();  
t = this.photo.getBytesTotal();  
if (t\>0 && t == l) {  
this.onEnterFrame = fadeIn;  
this.photo.\_x = absX-this.photo.\_width/2;  
this.photo.\_y = absY-this.photo.\_height/2;  
} else {  
//trace(l/t);  
}  
};  
MovieClip.prototype.fadeIn = function() {  
if (this.photo.\_alpha\<100-this.fadeSpeed) {  
this.photo.\_alpha += this.fadeSpeed;  
} else {  
this.photo.\_alpha = 100;  
this.onEnterFrame = null;  
}  
};  
//change photo with keys  
this.onKeyDown = function() {  
if (Key.getCode() == Key.LEFT) {  
this.changePhoto(-1);  
change = 0;  
} else if (Key.getCode() == Key.RIGHT) {  
this.changePhoto(1);  
change = 0;  
}  
};  
Key.addListener(this);

//autoplay  
change = 0;  
\_root.createEmptyMovieClip(“container”, 1000);  
\_root.container.onEnterFrame = function() {  
change++;  
if (change\>=25) {  
\_root.changePhoto(1);  
change = 0;  
}  
};

[/AS]

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 7, 2003, 9:54pm UTC](https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892/2 "2003-11-07T21:54:54Z")

</div>

Using your current code, you could use a flag:

```auto
var autoplay = true, change = 0;
this.createEmptyMovieClip("container", 1000);
container.onEnterFrame = function() {
	if (autoplay && change++>=25) {
		changePhoto(1);
		change = 0;
	}
};
startAutomaticSlideshow_btn.onPress = function() {
autoplay = true;
};
stopAutomaticSlideshow_btn.onPress = function() {
autoplay = false;
};

```

And there’s another option, which is [font=courier new]setInterval[/font]:

```auto
var milliseconds = 1000, intervalid;
intervalid = setInterval(changePhoto, milliseconds, 1);
startAutomaticSlideshow_btn.onPress = function() {
intervalid = setInterval(changePhoto, milliseconds, 1);
};
stopAutomaticSlideshow_btn.onPress = function() {
clearInterval(intervalid);
};

```

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 10, 2003, 3:25pm UTC](https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892/3 "2003-11-10T15:25:09Z")

</div>

I see how that would work, except for how I attach it to my pause/play button. How should I go about doing that? Thanks for the help!

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 10, 2003, 7:33pm UTC](https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892/4 "2003-11-10T19:33:10Z")

</div>

Put the code on the frame actions, not on the buttons. Just replace _startAutomaticSlideshow\_btn_ and _startAutomaticSlideshow\_btn_ with the instance names of your buttons to start/stop the slideshow. 🙂

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 10, 2003, 8:07pm UTC](https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892/5 "2003-11-10T20:07:29Z")

</div>

it worked absolutely perfectly! thank you SO much!

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 10, 2003, 8:32pm UTC](https://forum.kirupa.com/t/slideshow-autoplay-w-controls/34892/6 "2003-11-10T20:32:52Z")

</div>

No problem. 😉