看效果先:
下面是代码:
import mx.transitions.Tween;
import mx.transitions.easing.*;
px = new Array();
this.createEmptyMovieClip("smallMC", 0);
smallMC.setMask(s3mask);
smallMC._x = 50;
smallMC._y = 50;
var lock:Boolean;
lock = false;
var Row:Number;
//一行放多少个图片
Row = 2;
var picNum:Number;
//图片的总数
picNum = 6;
function ll(i:Number) {
_root.smallMC.createEmptyMovieClip("ss"+i, i);
_root.smallMC["ss"+i].createEmptyMovieClip("ss", i+15);
_root.smallMC["ss"+i].no = i;
//****************设置小图片的位置****************************
for (j=1; j<=Math.ceil(picNum/Row); j++) {
for (k=1; k<=Row; k++) {
aa = k+(j-1)*Row;
_root.smallMC["ss"+aa]._y = 10+(j-1)*70;
_root.smallMC["ss"+aa]._x = 7+(k-1)*72;
}
}
//****************设置小图片的位置****************************
//***********设置小图片的点击事件*********************************
//if (_root.smallMC["ss"+i].no) {
_root.smallMC["ss"+i].onRelease = function() {
if (lock != true) {
lb2(this.no);
}
};
//}
_root.smallMC["ss"+i].intiX = _root.smallMC["ss"+i]._x;
_root.smallMC["ss"+i].intiY = _root.smallMC["ss"+i]._y;
_root.smallMC["ss"+i].targetscale = 20;
_root.smallMC["ss"+i].ss.attachMovie("pic"+i, "pic"+i, i);
////////用于将图片居中///////////////////////////////////
_root.smallMC["ss"+i].ss._x = -(_root.smallMC["ss"+i].ss._width/2);
_root.smallMC["ss"+i].ss._y = -(_root.smallMC["ss"+i].ss._height/2);
//////////////////////////////////////////////////////////////////////
_root.smallMC["ss"+i]._yscale = _root.smallMC["ss"+i]._xscale=20;
//*********小图片的加载进度条设置***********************************
//myLoader = new MovieClipLoader();
//myListener = new Object();
//myListener.onLoadProgress = function(loadTargetMC, loadedBytes, totalBytes) {
////aa = (loadedBytes/totalBytes)*100;
//};
//myListener.onLoadStart = function(loadTargetMC) {
//_root.smallMC["ss"+i].ss.stop();
//};
//myListener.onLoadComplete = function(loadTargetMC) {
//_root.smallMC["ss"+i].ss.play();
//_root.smallMC["ss"+i].ss._xscale = _root.smallMC["ss"+i].ss._yscale=3.2;
//i = i+1;
//if (i<13) {
//控制加载图片的数目
//ll(i);
//}
//};
//myLoader.addListener(myListener);
//myLoader.loadClip("imgs/pic"+i+".jpg", _root.smallMC["ss"+i].ss);
}
ll(1);
ll(2);
ll(3);
ll(4);
ll(5);
ll(6);
lb2(1);
function lb2(i:Number) {
lock = true;
////////////////no记录着当前展示图片的编号/////////////////////////////////////////
targetx = 300;
targety = 150;
///////////////////////////////////////让在展示的图片变回去按钮栏中///////////////////////////////
if (no != undefined) {
var myTween:Tween = new Tween(_root.smallMC["ss"+no], "_xscale", mx.transitions.easing.Elastic.easeOut, 100, 20, 10, false);
var myTween:Tween = new Tween(_root.smallMC["ss"+no], "_yscale", mx.transitions.easing.Elastic.easeOut, 100, 20, 10, false);
var myTween:Tween = new Tween(_root.smallMC["ss"+no], "_x", mx.transitions.easing.Elastic.easeOut, targetx, intiX, 10, false);
var myTween:Tween = new Tween(_root.smallMC["ss"+no], "_y", mx.transitions.easing.Elastic.easeOut, targety, intiY, 10, false);
}
///////////////////////////////////////让在展示中心的图片变回去按钮栏中///////////////////////////////
////////////////////设置当前图片的初始位置(既是当前展示图片在按钮栏中的位置)/////////////////////////
if (no != i) {
no = i;
intiX = _root.smallMC["ss"+i]._x;
intiY = _root.smallMC["ss"+i]._y;
}
///////////////////////////设置展示图片的透明度///////////////////////////////////
mytt = new Tween(_root.smallMC["ss"+i], "_alpha", Elastic.easeOut, 0, 100, 5, true);
////////////////////////////这个aa函数是用于当前图片在展示区的放在功能的///////////////
function aa() {
var myTween:Tween = new Tween(_root.smallMC["ss"+i], "_xscale", mx.transitions.easing.Elastic.easeOut, 20, 100, 30, false);
var myTween:Tween = new Tween(_root.smallMC["ss"+i], "_yscale", mx.transitions.easing.Elastic.easeOut, 20, 100, 30, false);
_root.smallMC["ss"+i].onEnterFrame = function() {
if (this._xscale == 100) {
lock = false;
delete this.onEnterFrame;
}
};
clearInterval(ID);
}
//////////////////////设置展示图片从按钮栏往展示区移动效果//////////////////////
var myTween:Tween = new Tween(_root.smallMC["ss"+i], "_x", mx.transitions.easing.Elastic.easeOut, intiX, targetx, 10, false);
var myTween:Tween = new Tween(_root.smallMC["ss"+i], "_y", mx.transitions.easing.Elastic.easeOut, intiY, targety, 10, false);
stop();
ID = setInterval(aa, 500);
}
源文件下载: 图片效果系列之三.rar