# \[FMX\] fading grid

**URL:** <https://forum.kirupa.com/t/fmx-fading-grid/34984>\
**Category:** flash\
**Created:** [November 8, 2003, 8:50pm UTC](https://forum.kirupa.com/t/fmx-fading-grid/34984 "2003-11-08T20:50:46Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Maizoon](https://avatars.discourse-cdn.com/v4/letter/m/3d9bf3/32.png) [@Maizoon](https://forum.kirupa.com/u/Maizoon)\
**Post date:** [November 8, 2003, 8:50pm UTC](https://forum.kirupa.com/t/fmx-fading-grid/34984/1 "2003-11-08T20:50:46Z")

</div>

I did a search but haven’t found the answer to my question.

I did the fading grid tutorial and it worked out beautifully…but I was wondering how to invoke it again? I Know if you put

[AS]  
on (release){  
fadeOut(0, 5)  
}  
[/AS]

it works, but if you push the button again nothing happens? How do i get the grid to fade again?

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 8, 2003, 8:54pm UTC](https://forum.kirupa.com/t/fmx-fading-grid/34984/2 "2003-11-08T20:54:26Z")

</div>

You’d have to set the alpha property of each movieclip back to 100, then call fadeOut again 🙂 You can set the alphas by a for loop:

```auto

btn.onRelease = function(){
for(i=0;i<=amountofboxes;i++){
this["box"+i]._alpha = 100
}
fadeOut(0,5)
}

```

For example, don’t know if the instance names and paths are correct … I don’t have enough time right now to check.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 8, 2003, 9:14pm UTC](https://forum.kirupa.com/t/fmx-fading-grid/34984/3 "2003-11-08T21:14:35Z")

</div>

thanks 🙂

the exact context if anyone else wants to know is:

[AS]  
btn.onRelease = function(){  
for(i=0;i\<=amH\*amV-1;i++){  
this[“box”+i].\_alpha = 100  
}  
fadeOut(0,5)  
}  
[/AS]

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 8, 2003, 11:03pm UTC](https://forum.kirupa.com/t/fmx-fading-grid/34984/4 "2003-11-08T23:03:33Z")

</div>

Yep, you got it 🙂

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [November 9, 2003, 11:24pm UTC](https://forum.kirupa.com/t/fmx-fading-grid/34984/5 "2003-11-09T23:24:47Z")

</div>

Ok…so I took your FadeOut function, reversed everything and turned it into FadeIn. My question now is how to make it execute FadeOut once its totally done with FadeIn (ie all the boxes are back in)

Heres all the script:

[AS]  
//Declare variables  
xspacing = tbBox.\_width;  
yspacing = tbBox.\_height;  
depth = 0;  
azcount = 0;  
smoothness = 90;  
frothness = 10; // for bringing them back in  
//Calculate positions and values  
amH = Math.ceil(tbHolder.\_width/tbBox.\_width);  
amV = Math.ceil(tbHolder.\_height/tbBox.\_height);  
tbT = amV_amH-1;  
tbBorder.\_height = tbHolder.\_height+1;  
tbBorder.\_width = tbHolder.\_width+1;  
tbBorder.\_x = tbHolder.\_x-0.5;  
tbBorder.\_y = tbHolder.\_y-0.5;  
//Create grid  
for (var k = 0; k\<amV; k++) {  
for (i=0; i\<amH; i++) {  
tbBox.duplicateMovieClip(“tbBox”+depth, depth);  
cur = this[“tbBox”+depth];  
cur.\_x = tbHolder.\_x+(xspacing_i);  
cur.\_y = tbHolder.\_y+(yspacing_k);  
depth++;  
}  
}  
//  
//  
// End of grid  
//  
//  
function fadeOut(startboxnr, speed) {  
fadeMC(startboxnr, speed);  
}  
function fadeMC(mcnr, speed) {  
azcount++;  
this[“tbBox”+mcnr].onEnterFrame = function() {  
this.\_alpha -= speed;  
if (this.\_alpha\<=smoothness) {  
this.onEnterFrame = null;  
continueFade(this, speed);  
mcnr += 1;  
fadeOut(mcnr, speed);  
}  
};  
}  
function continueFade(mc, speed) {  
mc.onEnterFrame = function() {  
mc.\_alpha -= speed;  
if (mc.\_alpha\<=0) {  
delete mc.onEnterFrame;  
}  
};  
}  
// Start of Fade in Function  
function fadeIn(startboxnr, speed) {  
fadeMCin(startboxnr, speed);  
}  
function fadeMCin(mcnr, speed) {  
azcount–;  
this[“tbBox”+mcnr].onEnterFrame = function() {  
this.\_alpha += speed;  
if (this.\_alpha\>=frothness) {  
this.onEnterFrame = null;  
continueFadeIn(this, speed);  
mcnr -= 1;  
fadeIn(mcnr, speed);  
}  
};  
}  
function continueFadeIn(mc, speed) {  
mc.onEnterFrame = function() {  
mc.\_alpha += speed;  
if (mc.\_alpha\>=100) {  
delete mc.onEnterFrame;  
}  
};  
}  
fadeIn(amH_amV-1, 5);  
[/AS]

So basically once you start the movie it fades the squares in. I’d like it to fade them out once its done fading them all in…I’ve tried putting FadeOut(0,5) in various places but all it does is stop the fade in prematurly. I also tried putting in a counter based on i & k but that didn’t work out to good. I even had an  
[AS]  
if (mcnr \<= 0){  
fadeOut(0,5);  
}  
[/AS]

at the bottom of the script and that didn’t help the situation either, I thought I understood what was going on here but I guess not 😛