Im having heaps of trouble with my slider.

Is it possible to email you the documents to see how I should incorporate the code?

Thanks so much.

Matt

how can i move the mcNav from a button that is placed in another movie clip named “navRight”?

You bet. Assuming the button’s instance name is myButton (but use whatever instance name you like), and assuming navRight is the instance name of that other movie clip, then all you have to do is path to that button in order to handle its onRelease (or similar) event.

Instead of this:

mcLogo.onRelease = toggleNav;

… which is what I showed before, you could route that event handler like this:

navRight.myButton.onRelease = toggleNav;

… and the toggleNav() function wouldn’t change.

I would also like to have a button placed inside “mcNav” which moves the clip to out of sight aswell.

In the same way, you would path to mcNav, by way of its instance name, then to the instance name of the button inside it. Assuming myButton, which could just as easily be the instance name of that second button:

mcNav.myButton.onRelease = toggleNav;

Both buttons can have the same instance name, because they’re both nested inside movie clips with distinct instance names. And both buttons can be assigned to the same event handler function.

To Cris …

I remember that reply, oddly enough. (Gosh, that was quite a while ago!) That sample code was written by M. A. Turner, actually, and looking at it now, I see quite a few errors with it — I’m guessing M. A. noticed that too and (I hope) fixed it.

The references to _global._focusrect and _global._quality, for example, don’t really do anything. Those properties are members of the MovieClip class, and the _global object doesn’t point to a movie clip, so if those really were necessary to M. A.’s needs — and I’m assuming they were — they should have been routed to the timeline in which the code was written (assuming it was written in the main timeline), which means _global should have been replaced with this, or omitted entirely.

The meat of the matter is M. A.’s approach to maintaining aspect ratio, which (rightly or wrongly) I never did test.

If you want want your images to scale to the browser and never crop, it means you will inevitably see letterboxing or pillarboxing when the browser’s aspect ratio isn’t the same aspect ratio of the image. There’s no way around that, and I hope it makes sense to you why. Assuming you’re okay with that, here’s a quick suggestion that will scale the image without cropping:

Stage.scaleMode = "noScale";
Stage.align = "TL";
var stageListener:Object = new Object ();
stageListener.onResize = positionContent;
Stage.addListener(stageListener);

function positionContent():Void {
  photo._width = Stage.width;
  photo._yscale = photo._xscale;
  if (photo._height > Stage.height) {
    photo._height = Stage.height;
    photo._xscale = photo._yscale;
  }
  photo._x = Stage.width / 2 - photo._width / 2;
  photo._y = Stage.height / 2 - photo._height / 2;
}
positionContent();

The basic mechanics are very similar to my original code prior to any of the comments. In this revision, the width of the photo is set to the width of the Stage. The height (via _yscale) is adjusted by the same value as the width. Then an if statement checks to see if the photo is now taller than the Stage. If so, the same manipulation is performed in reverse. After that, the image is centered (assuming an upper left registration point on the photo movie clip). This means the image will never be cropped.

I also wish to express my admiration for the time you are dedicating to help people out.

I am making a photography website where the images scale with the browser window. But the problem with the way I’m doing it now is that the image sometimes gets cropped with the browser window. I would like the images to be displayed as large as possible but without without cropping.

Thank you so much!

here is the code I’m using, from your responce to M.A. Turner:

Stage.align = “TL”;
Stage.scaleMode = “noScale”;
Stage.showMenu = false;
_global._focusrect = false;
_global._quality = “BEST”;
this._lockroot = true;

function set_stage() {
// SET THE ASPECT RATIO
original_width = 320;
original_height = 240;

scale_width = Stage.width/original_width;
scale_height = Stage.height/original_height;

if (scale_width>scale_height) {
new_ratio = scale_width;
} else {
new_ratio = scale_height;
}

// THE CLIP YOU WANT TO SCALE
my_mc._width = original_width*new_ratio;
my_mc._height = original_height*new_ratio; }

Stage.addListener({onResize:set_stage});

set_stage();

stop();

Im sorry to bother you, I know you have a life. I really need your help, I have a pending deadline - and im really in a bad way in regards to this. The site depends on these sliders to function.

Please let me know if you can provide some light on my last post : September 26th, 2008 at 12:59 am

Thank you so much again for helping this far - if you can help me again it would be amazing! Your an actionscript god!

Thanks so much again and sorry for bothering you! Cheers.

Thank you so much for your wonderful work - your a champion. This works perfectly.

Can you please help me further with the code to do these things - (same situation):

how can i move the mcNav from a button that is placed in another movie clip named “navRight”?

I would also like to have a button placed inside “mcNav” which moves the clip to out of sight aswell.

Thank you so much again for helping this far - if you can help me again it would be amazing! Your an actionscript god!

Thanks! Glad to hear it.

To Matt …

Im trying to create a sliding menu which sticks to the bottom of the stage (out of sight) until a button is clicked.

I recommend the Tween class for something like that — meaning, to animate the nav clip’s position. Makes it really easy, and I’ll show you that in just a sec. The other aspect is that you need to make your Stage.onResize handler smart enough to adjust itself to cases when the nav is supposed to be hidden versus when it’s supposed to show. Fortunately, you can resolve that as easily as using a Boolean variable. Check it out:

import mx.transitions.Tween;
import mx.transitions.easing.*;

Stage.scaleMode = "noScale";
Stage.align = "TL";
var stageListener:Object = new Object ();
stageListener.onResize = positionContent;
Stage.addListener(stageListener);

var navShowing:Boolean = false;
var tw:Tween;

function positionContent():Void {
  mcLogo._x = Stage.width / 2 - mcLogo._width / 2;
  mcLogo._y = Stage.height / 2 - mcLogo._height / 2;
  if (navShowing) {
    mcNav._y = Stage.height - mcNav._height;
  } else {
    mcNav._y = Stage.height;
  }
}
positionContent();

The first to lines import the classes necessary to use the Tween class; namely, the Tween class itself, and the numerous easing classes inside the easing package.

After that, you’ve got the same Stage.onResize code as shown in the original blog entry … followed by two new variables — navShowing, set to false by default, and tw — and finally the same positionContent() function. Notice the new lines inside the function: if navShowing is true (if (navShowing)), then set mcNav’s _y property to the height of the Stage minus the height of mcNav (which lets it show); otherwise, push it all the way down (which hides it).

At this point, all your button has to do is toggle isShowing and use the Tween class. Assuming, for sake of discussion, that mcLogo is your button, it could look like this:

mcLogo.onRelease = toggleNav;
function toggleNav():Void {
  if (navShowing) {
    tw = new Tween(mcNav, "_y", Strong.easeIn, mcNav._y,
                   Stage.height, 0.5, true);
  } else {
    tw = new Tween(mcNav, "_y", Strong.easeIn, mcNav._y,
                   Stage.height - mcNav._height, 0.5, true);
  }
  navShowing = !navShowing;
};

The Tween class takes a number of parameters: a) what object to tween, b) what property of that object to tween, c) what easing to use, d) the start value, e) the end value, f) a timing value (here, 0.5 seconds), and g) whether or not to use the timing value in terms of seconds (true) or frames (false).

I am currently stuck!

I am designing a re-sizable flash website which uses the same techniques as you have explained in this document to resize and position movieclips.

Although the problem is that Im trying to create a sliding menu which sticks to the bottom of the stage (out of sight) until a button is clicked. On click the menu will tween from the current_y to show the complete menu - ie.200pixels.

The menu is then returned to the originating _y by clicking a close button within the sliding menu movie clip itself.

Do you think you could please help me with the code????

You’ll be a life save if you can do this!

Thanks so much in advance.

Glad to hear it!