Zoom and scroll gallery

programming flash
1

I apologize if something like this has already been covered before.

At http://www.aarondeemer.com/, in the “new works” section he has a photo gallery that consists of a long strip of images, and when you click on one it scrolls toward it while zoming in. Does anyone know how this is done? I’ve been trying to figure it out for weeks now, and am stumped.

Thanks in advance for any help!

2

With just some motion tweening it’s not so much work. But if you have many pictures, you should let someone write you a little script.

3

wow very interesting!! nice work…
do u know easing tecnique??
ever see sliding menu tutorial by ilyas?
u have to know them first, to make one…
knowing using function makes it more easier…

4

using motion tweening for this effect makes it harder…
cause there’s an image positioning beside zooming and sliding…

5

Thanks for the links! I had been looking at the sliding menu tutorial, but I hadn’t seen the mouse easing one. I’ll trying putting them together to see what I get.

Thanks again!

6

don’t forget to search how to make & use functions…

7

I’ve been modifying the files from the sliding menu tutorial, and I’m stuck. I got it to scroll from side to side when you click on it, but you have to click over and over to get it to zoom in all the way.

I’ve uploaded what I’ve done so far here: http://filebox.vt.edu/users/kscully/scrollingwindow.fla

This is really driving me crazy.

8

hey scurvy… u have to loop your zoom()

MovieClip.prototype.zoom = function() {
	this.onEnterFrame = function() {
		destx = 800;
		desty = 200;
		posx = general._width;
		posy = general._height;
		velx = (destx-posx)/7;
		vely = (desty-posy)/7;
		general._width += velx;
		general._height += vely;
	};
};

the next thing u have to search is how button can do thing in different time to zoom out what u have zoom in…:slight_smile:

9

and for your move function… may be u want to use this rather than making several time…

MovieClip.prototype.slideX = function(endPosx) {
	this.onEnterFrame = function() {
		if (this._x<=endPosx) {
			currentPosx = this._x;
			diffPosx = endPosx-currentPosx;
			movex = diffPosx/5;
			this._x = this._x+movex;
			if (this._x>=endPosx) {
				this._x = endPosx;
				delete (this.onEnterFrame);
			}
		}
		if (this._x>=endPosx) {
			currentPosx = this._x;
			diffPosx = endPosx-currentPosx;
			movex = diffPosx/5;
			this._x = this._x+movex;
			if (this._x<=endPosx) {
				this._x = endPosx;
				delete (this.onEnterFrame);
			}
		}
	};
};
10

and i forgot, there’s

delete(this.onEnterFrame);

,or can be

this.onEnterFrame = null;

search explanation for this… after that use it in your function…

11

I’ve worked some more on the movie. It scrolls properly and I got it to zoom in and out. My problem now is that each time I zoom in, the maximum size keeps getting smaller and smaller (by 1/2 each time). It seems like it’s either quitting the loop in the zoom function too early, or it’s passing the wrong information somewhere. Everything else works perfectly fine. What am I doing wrong?

The updated file is <a href=“http://filebox.vt.edu/users/kscully/scrollingwindow.fla”>here</a>.

Thank you for all your help so far! I really appreciate it.

12

your problem is in your zoom function(), don’t use

if ( general._width <= 800 ) {

below that width will active with your function…

incrementx = ( 800 - currentWidth )/10;
incrementy = ( 200 - currentHeight )/10;

if you’re click before your desire size, ‘current’ is refer to ‘current size now’ so the increment will base on size when u click it…

here’s a function u could learn & use… or modify it…

MovieClip.prototype.zoom = function(endWidth, endHeight) {
	this.onEnterFrame = function() {
		currentWidth = this._width;
		diffWidth = endWidth-currentWidth;
		zoomWidth = diffWidth/5;
		this._width += zoomWidth;
		//
		currentHeight = this._height;
		diffHeight = endHeight-currentHeight;
		zoomHeight = diffHeight/5;
		this._height += zoomHeight;
	};
};

I need Kax help for correcting & simplify this function… could u send him PM for me? but so far it works

call

on (release) {
	zoom(200, 40);
}

it is for the fix desired size…

on (release) {
	zoom(this._width*2, this._height*2);
}

this will produce never ending zoom…

on (release) {
	iAmActive = !iAmActive;
	if (iAmActive) {
		zoom(this._width/2, this._height/2);
	} else {
		zoom(this._width*2, this._height*2);
	}
}

this is similar to what u want to achieve now…
I hope this could help u…:slight_smile:

13

if not use the “if ( general._width <= 800 ) {”,
Anyone knows what else can put into the frame, so as to zoom in and out in right size?