Photo gallery puts photos down and right (kirupa.com tut)

I followed the photo gallery tutorial here at kirupa.com and all went well except when my photos display on my site, they are down and to the right of where my photo instance is.

Here is the script:

//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 = "photogalpics/";

// fill this array with your pics

this.pArray = ["scenery1.jpg", "scenery2.jpg", "winnie1.jpg", "winnie2.jpg", "shiloh1.jpg", "mysetup.jpg", "pc1.jpg", "baseball1.jpg", "baseball2.jpg", "monkey1.jpg"];

this.fadeSpeed = 30;

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) {

		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);

and here is the my site so you can see what I’m talking about:

http://rberry883.home.comcast.net

I can’t figure out where in the code I could change it to display the photos somewhere else. I only have one ‘photo’ instance on my site/library and I place it right above the little arrows.

Any help is appreciated, this has been driving me nuts for two days now.

Check the registrationpoint of your photo mc, it’s (probably) in the middle, should be topleft:)

scotty(-:

Being a newbie to Flash, could you tell me how I check the registrationpoint of my photo mc? Do I just click on it and look at the coordinates in the property panel?

I’m not exactly sure where to look for it.

rberry88

Yep:)
Double click your photo mc, now if you look in the Info panel, you’ll see 9 little squares. Select the topleft and give x/y the value 0. After this you’ll have to replace your photo mc, but your photo’s will be loading there where you want them to;)

scotty(-:

Got it, I was thinking it was supposed to show up in the properties panel. I checked the info panel after posting the last time and found it. I knew what I was looking for but only saw it when I created new symbols and didn’t know how to get that back up.

It’s fixed now, I just need to do some tweaking and continue working on the rest of the site.

I appreciate the help. :slight_smile:

no problem:thumb: