分享
 
 
 

Flash实现动态遮罩:图片渐出效果

王朝other·作者佚名  2006-11-24
窄屏简体版  字體: |||超大  

演示效果:

点击这里下载源文件

//-------------------------------------------------------------------

//as代码如下;被遮罩图片mc名称为img-mc;

//特点自动适应图片大小,自动判断子遮罩个数,可随意修改子遮照大小;

//-------------------------------------------------------------------

//

Stage.showMenu = false;

Stage.scaleMode = "noScale";

fscommand(allowscale, true);

createEmptyMovieClip("mask", -1);

mask.createEmptyMovieClip("mask0", -2);

with (mask.mask0) {

beginFill(0xcccccc, 100);

moveTo(0, 0);

lineTo(0, 100);

lineTo(100, 100);

lineTo(100, 0);

lineTo(0, 0);

endFill();

_width = 1;

_height = 1;

}

//以上为创建mask元件和mask0子元件,这两个元件就是用于遮罩图片的。

mask._x = img_mc._x=0;

mask._y = img_mc._y=0;

img_mc.setMask(mask);

//以上为设置遮罩和遮罩层的位置;

maskNum = 0;

//初始化遮罩子元素的个数;

box = 40;

//初始化子遮罩正方形的边长;

lNum = Math.ceil(img_mc._width/box)+1;

//获得被遮罩图片的一行需要多少个子遮罩;

cNum = Math.ceil(img_mc._height/box)+1;

//获得被遮罩图片的一列需要多少个子遮罩;

maxNum = lNum*cNum;

//得到子遮罩元件的总数;

var myArray = new Array();

//定义数组;

for (i=0; i<cNum; i++) {

myArray[i] = [];

for (j=0; j<lNum; j++) {

myArray[i].push(i*lNum+j+1);

//该两个循环生成一个二维数组用于存储子遮罩的行和列的编号。

}

}

for (i=0; i<cNum; i++) {

if (i%2 == 0) {

myArray[i];

} else {

myArray[i] = myArray[i].sort(order);

//当遇到奇数行的时候,倒排子遮罩的编号;该方法是为了让子遮罩从右到左产生;

}

for (j=0; j<lNum; j++) {

with (mask) {

masks = mask0.duplicateMovieClip("mask"+(myArray[i][j]), myArray[i][j]);

//根据元件mask0复制出子遮罩,并将名称存入masks数组;

masks._x = j*(box-1);

//设置单个子遮罩的x和y坐标值,将其平铺在整个被遮罩图片上;

masks._y = i*(box-1);

//

masks.xs = i;

//设置自遮罩在二为数组myArray中的编号;

masks.ys = j;

masks._width = 0;

//初始化子遮罩不可见;

masks._height = 0;

//

masks.onEnterFrame = function() {

if (_root.myArray[this.xs][this.ys] == _root.maskNum) {

this.mcZoom();

//执行子遮罩缩放动画;

}

};

}

}

}

_root.onEnterFrame = function() {

if (maskNum<=maxNum) {

_root.maskNum++;

//递加子遮罩个数;

}

};

function order(a, b) {

//该函数用于降幂排序数组;

if (a>b) {

return -1;

} else if (a<b) {

return 1;

} else {

return 0;

}

}

MovieClip.prototype.mcZoom = function() {

//子遮罩动画部分;

this.onEnterFrame = function() {

this._width += (box-this._width)/10;

this._height += (box-this._height)/10;

};

};

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有