The following animation is made with a simple motion tween in wich the square first change in width before it change in height.
How do I accomplish the same effect with actionscript?
Ok, I downloaded the file, dropped 6 jpgs into the apropriate directory (I didn’t want to change your script yet), renaming them img1.jpg thru img6.jpg. Each of these jpgs are roughly 150x150 pixel pics. And clicked test movie.
When it first brings up the test movie window, it is a blank area with a next and prev button.
When I click on NEXT or PREV the first time, I see what I believe to be the resizing frame resizing itself down to nothing (it shrinks and idsappears). After that, clicking the buttons dont do anything (I assume this is because the mc is already shrunk down to nothing).
Any ideas as to why this might be?
I have Flash MX, not MX pro, will this script work with MX?
No, I doubt it.
I am now making a revised edition with separate buttons for each clip, so we shall see.
The code is the prob posssibly, I didn’t knew then, what I know now, so I will break it, and fix it.
But, maybe not tonite, it’s getting late here
The reason why the pics were not showing up was because when I had saved them in photoshop, I had saved them with the “progressive 5” setting type of JPG.
I had no idea that progressive pics wont show up in Flash. I still dont know why, but I just read that in a different post.
Now the only issue with your script is that the resizing of the framing box, doesn’t necessarily acheive the right size to frame the loaded pic. But, at least I can see the pic now, which is a good thing. I can build on this now
About, not achieving the right size, find the conditional checking clip width and height, and replace ‘||’ with '&&'
It should wait both values, not just the other.
See if it helps
OK, today I found time to make more serious version, so here it is.
What the hell, it even has a preloader built in
It is made out of 3 functions, calling each other.
There are parts not necessary for the actual function, but are visually appealing.
I have added comments about what to do before start, so anyone interested can test it.
And post impressions, of course.
Your code is based on the idea of dynamically created buttons from an array. Under normal circumstances that would be a good thing.
I happen to have a situation where my buttons have to be all over the screen, not in tidy rows. So, I created my buttons manually.
So, I made a couple of tweaks to your code related. But, its not working. I am wondering if you can spot the prob and/or suggest a better way to do it.
[AS]
//inititate vars and functions
var path = “…/images/p”;
init();
//startup definition
function init() {
//—optional–
preloader._x = border._x;
preloader._y = border._y;
//--------------
var startY = btn._y;
btn._visible = 0;
preloader._alpha = 0;
/* ------------------------my change 1-------------------------------------/
for (var i = 1; i<=100; ++i) {
this[“p”+i].onrelease = loader;
/ ----------------------------- end my change 1--------------------------/
}
//}
//clip loader definition
function loader(j) {
//clear interval, not to overlap, when jumping from btn to btn
clearInterval(loadInt);
//return objects to initital state
preloader._alpha = 100;
preloader.bar._xscale = 0;
//actual container definition
this.createEmptyMovieClip(‘holder’, -1);
holder._x = holder._y=30;
holder._alpha = -50;
/ -----------------------my change 2--------------------------------------/
/holder.loadMovie(path+imgArray[j]+".jpg");/
holder.loadMovie(path+this._name+".jpg");
/ --------------------end my change 2-----------------------------------*/
///
loadInt = setInterval(preload, 50, holder);
}
//preloading
function preload(clip) {
//‘border’ is used as a separate clip, to achieve the outline effect
//align the preloader with ‘border’ clip
//
//in-built preloader, could be defined elsewhere,
//or used as a custom class component
preloader._x = border._x;
preloader._y = border._y;
var loaded = clip.getBytesLoaded();
var total = clip.getBytesTotal();
var percent = Math.round((loaded/total)*100);
preloader.bar._xscale = percent;
preloader._txt.text = “loading … “+percent+” %”;
//
//this is why preloader is necessary
if (loaded == total) {
var targW = clip._width;
var targH = clip._height;
var x = clip._x+clip._width/2;
var y = clip._y+clip._height/2;
var dX = x-border._x;
var dY = y-border._y;
//
preloader._txt.text = “complete … “+percent+” %”;
preloader._alpha -= 7;
}
border.onEnterFrame = function() {
//just use the preload values again, to separate this event
if (loaded == total) {
var diffW = targW-this._width;
var diffH = targH-this._height;
this._x += dX/10;
this._y += dY/10;
this._width += diffW/5;
this._height += diffH/5;
//when ‘diff’ becomes small beyond visual recognition
//initiate image fade in effect
if ((Math.abs(targH-this._height))<0.3 && (Math.abs(targW-this._width))<0.2) {
clip._alpha += 5;
if (clip._alpha>=100) {
//when alpha reached, delete everything
//to return to ‘init’ phase,
//and wait another ‘loader()’ command
clearInterval(loadInt);
delete border.onEnterFrame;
}
}
}
};
}
//---------- HAVE FUN ------------ 13.03.2004.