# Centering photos within movie clip

**URL:** <https://forum.kirupa.com/t/centering-photos-within-movie-clip/34716>\
**Category:** Uncategorized\
**Created:** [November 5, 2003, 4:55pm UTC](https://forum.kirupa.com/t/centering-photos-within-movie-clip/34716 "2003-11-05T16:55:23Z")\
**Posts on this page:** 4\
**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 5, 2003, 4:55pm UTC](https://forum.kirupa.com/t/centering-photos-within-movie-clip/34716/1 "2003-11-05T16:55:23Z")

</div>

hey everyone! 🙂

i have a question about sbeener’s photo gallery script. i have pictures of different sizes, and i’ve managed to get that working quite well by using an empty movie clip that’s coded to be resized to the photo. i was just wondering if there’s a way, instead of loading the photos flush to the upper left corner, to center the photos on the stage or in the movie clip (right now the movie clip is in the upper left corner).

here’s my code…

[AS]  
//Code written by sbeener (suprabeener)  
/\*  
i wrote this code, but you can use and abuse it however you like.  
the methods are defined in the order which they occur to make it  
easier to understand.  
\*/  
// variables ------------------------------------------  
// put the path to your pics here, include the slashes (ie. “pics/”)  
// leave it blank if they’re in the same directory  
this.pathToPics = “”;  
// fill this array with your pics  
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;  
// MovieClip methods ----------------------------------  
// d=direction; should 1 or -1 but can be any number  
//loads an image automatically when you run animation  
loadMovie(this.pathToPics+this.pArray[0], \_root.photo);  
MovieClip.prototype.changePhoto = function(d) {  
// make sure pIndex falls within pArray.length  
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() {  
// specify the movieclip to load images into  
var p = \_root.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) {  
trace(this.photo.\_width);  
trace(this.photo.\_height);  
this.onEnterFrame = fadeIn;  
} 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;  
}  
};  
// Actions -----------------------------------------  
// these aren’t necessary, just an example implementation  
this.onKeyDown = function() {  
if (Key.getCode() == Key.LEFT) {  
this.changePhoto(-1);  
} else if (Key.getCode() == Key.RIGHT) {  
this.changePhoto(1);  
}  
};  
Key.addListener(this);  
[/AS]

thanks!! :thumb:

---

<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 5, 2003, 6:02pm UTC](https://forum.kirupa.com/t/centering-photos-within-movie-clip/34716/2 "2003-11-05T18:02:13Z")

</div>

i think this is what you’re looking for.  
it’s not perfect: you must put the dimensions of your first picture in the code (divided by two, where i have the 200 and 133).  
it must be possible to have this also done by code but till now i can’t manage(-:

[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-200;//first picture = 400 width/2  
this.photo.\_y = absY-133;//first picture = 266 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;  
}  
};  
this.onKeyDown = function() {  
if (Key.getCode() == Key.LEFT) {  
this.changePhoto(-1);  
} else if (Key.getCode() == Key.RIGHT) {  
this.changePhoto(1);  
}  
};  
Key.addListener(this);  
[/AS]

scotty

---

<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 5, 2003, 8:28pm UTC](https://forum.kirupa.com/t/centering-photos-within-movie-clip/34716/3 "2003-11-05T20:28:53Z")

</div>

good news! it works :thumb: generally i believe the pictures my boss will be giving me for the various slideshows they want will be the same size photos. how wonderful 😃 thank you so very 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 5, 2003, 8:33pm UTC](https://forum.kirupa.com/t/centering-photos-within-movie-clip/34716/4 "2003-11-05T20:33:49Z")

</div>

LOL, you’re welcome(-: