A Flash Developer Resource Site

Results 1 to 11 of 11

Thread: Actionscript to fade in/fade out picture depending on frame?

  1. #1
    Member
    Join Date
    May 2003
    Posts
    95

    Actionscript to fade in/fade out picture depending on frame?

    I've searched the board but I can't figure out the answer to my question. I just want to fade in/out a movieclip. I can do this with tweens, but I'm really interested in how this would be done with actionscript.

    How could I make it so that the fade in occurs with frames 1-15, stops, and then starting with 16 fades out?

    I do have some code that will import a picture into a movieclip and fade it in, but I'm not sure how to alter the code so that the pic fades out on frame 16. The code below is fairly detailed... I would not mind a basic solution!!

    Thanks for your help!

    PHP Code:
    init = function () {
            
    this.myContainer this.createEmptyMovieClip("cont"1);
        
    cont._x 0;
        
    cont._y 130;
            
    this.myContainer._alpha 0;
            
    this.myContainer.loadMovie("picture.jpg");
            
    this.preloadJpg();
            };

    preloadJpg = function() {
            
    this.onEnterFrame = function() {
                    if (
    this.myContainer.getBytesLoaded()>100 && this.myContainer.getBytesLoaded()>=this.myContainer.getBytesTotal()) {
                            
    this.fadePicIn();            
                            }
            };
    };
    fadePicIn = function() {
            if(
    this.myContainer._alpha 100){
                    
    this.myContainer._alpha += 10;
            } else {
                    
    this.onEnterFrame undefined;
            }
    }
    this.init(); 

  2. #2
    Junior Member
    Join Date
    Sep 2005
    Posts
    16
    can't you just check to see if the _currentframe ==16 and then run a fadePicOut function that -= the alpha?
    -VC

  3. #3
    Member
    Join Date
    May 2003
    Posts
    95
    Perhaps? Could you show me how I could do that? This didn't work..


    PHP Code:
    init = function () { 
            
    this.myContainer this.createEmptyMovieClip("cont"1); 
        
    cont._x 0
        
    cont._y 130
            
    this.myContainer._alpha 0
            
    this.myContainer.loadMovie("picture.jpg"); 
            
    this.preloadJpg(); 
            }; 

    preloadJpg = function() { 
            
    this.onEnterFrame = function() { 
                    if (
    this.myContainer.getBytesLoaded()>100 && this.myContainer.getBytesLoaded()>=this.myContainer.getBytesTotal()) { 
                            
    this.fadePicIn(); 
                    if (
    _currentframe ==16)
                            
    this.fadePicOut();
                            } 
            }; 
    }; 
    fadePicIn = function() { 
            if(
    this.myContainer._alpha 100){ 
                    
    this.myContainer._alpha += 10
            } else { 
                    
    this.onEnterFrame undefined
            } 

    fadePicOut = function() { 
            if(
    this.myContainer._alpha 100){ 
                    
    this.myContainer._alpha -= 10
            } else { 
                    
    this.onEnterFrame undefined
            } 

    this.init(); 
    Last edited by sirenetta1; 09-21-2005 at 03:56 PM.

  4. #4
    Junior Member
    Join Date
    Sep 2005
    Posts
    16
    first of all:

    fadePicOut = function() {
    if(this.myContainer._alpha >= 100){
    this.myContainer._alpha -= 10;
    } else {
    this.onEnterFrame = undefined;
    }
    }

    then you need to run a check on whatever mc or the main stage has the frames 1-16. when you run the check just ask if ("whatever"._currentframe==16) { fadePicOut(); }
    -VC

  5. #5
    Member
    Join Date
    May 2003
    Posts
    95
    Thanks for your response! I added the "this" statement, but this didn't work either?

    PHP Code:
    if (this._currentframe ==16)
    this.fadePicOut();
                            } 
    PHP Code:
    init = function () { 
            
    this.myContainer this.createEmptyMovieClip("cont"1); 
        
    cont._x 0
        
    cont._y 130
            
    this.myContainer._alpha 0
            
    this.myContainer.loadMovie("picture.jpg"); 
            
    this.preloadJpg(); 
            }; 

    preloadJpg = function() { 
            
    this.onEnterFrame = function() { 
                    if (
    this.myContainer.getBytesLoaded()>100 && this.myContainer.getBytesLoaded()>=this.myContainer.getBytesTotal()) { 
                            
    this.fadePicIn(); 
                    if (
    this._currentframe ==16)
                            
    this.fadePicOut();
                            } 
            }; 
    }; 
    fadePicIn = function() { 
            if(
    this.myContainer._alpha 100){ 
                    
    this.myContainer._alpha += 10
            } else { 
                    
    this.onEnterFrame undefined
            } 

    fadePicOut = function() { 
            if(
    this.myContainer._alpha 100){ 
                    
    this.myContainer._alpha -= 10
            } else { 
                    
    this.onEnterFrame undefined
            } 

    this.init(); 

  6. #6
    Junior Member
    Join Date
    Sep 2005
    Posts
    16
    this._currentframe <-- note the period
    -VC

  7. #7
    Member
    Join Date
    May 2003
    Posts
    95
    Well, the fadeout doesn't work... I'll post the .fla? I have a stop action on frame 15 because the rest of my content stops on frame 15. I have an outside button in another file that when pressed, the timeline will play frame 16-30.

    Thanks!
    Attached Files Attached Files

  8. #8
    Senior Member
    Join Date
    Oct 2004
    Posts
    134
    change your fadePicIn function to:
    Code:
    fadePicIn = function() { 
    		trace("running");
            if(this.myContainer._alpha < 100 && !this.fadedIn){ 
                    this.myContainer._alpha += 10;
            } else if(this.fadedIn) { 
    				if(this.myContainer._alpha > 0){
                   		 this.myContainer._alpha -= 10;
    				}else{
    					delete this.onEnterFrame;
    				}
            } else {
    			this.fadedIn = true;
    		}
    }
    (and try to ignore all the phantom tabs here )

  9. #9
    Member
    Join Date
    May 2003
    Posts
    95
    Hi Mattcow!

    Well, the picture now fades in and fades out, but what I needed was for the picture to fade in from frame 1-15, stop, and then on frame 16 on fade out.

    On frame 15, I have a stop action because I have an outside button that when click should play frames 16 on as an exit transition. So, I need the picture to fade out from 16 on...

    Can you help?

    I'll attach your example to this post!
    Attached Files Attached Files

  10. #10
    Senior Member
    Join Date
    Oct 2004
    Posts
    134
    you will have to loose the idea of frames. this is actionscript . you can change the timing by changing the 'fade rate' and make your button mc show only when your picture has finished fading in. like so:
    Code:
    var fadeRate = 1;
    fadePicIn = function() { 
    		trace("running");
            if(this.myContainer._alpha < 100 && !this.fadedIn){ 
                    this.myContainer._alpha += fadeRate;
            } else if(this.fadedIn) {
    				// yourButton._visible = true
    				if(this.myContainer._alpha > 0){
                   		 this.myContainer._alpha -= fadeRate;
    				}else{
    					delete this.onEnterFrame;
    				}
            } else {
    			this.fadedIn = true;
    		}
    }

  11. #11
    Member
    Join Date
    May 2003
    Posts
    95
    Hello again!

    I'll show you more of my files so you can see how it works... the main_test.swf will show you how the transitions are working and content1.fla is what we are working on right now. Click on one of the item buttons to see how the transitions are working...To keep the frame idea, can I use different code? OR, do I have to resort to using tweens for this?
    Attached Files Attached Files
    Last edited by sirenetta1; 09-21-2005 at 09:05 PM.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center