The forums have permanently moved to forum.kirupa.com. This forum will be kept around in read-only mode for archival purposes. To learn how to continue using your existing account on the new forums, check out this thread.


Results 1 to 10 of 10

Thread: RollOver, RollOut and Release acting up

Hybrid View

  1. #1

    RollOver, RollOut and Release acting up

    This must be a very basic question, but I'm lost on it.

    The premise is simple. OnRollOver button 'A' gets color 'X', onRollOut button 'A' gets color 'Y', onRelease button 'A' gets color 'Z'.

    Now, ofcourse, when a button gets pressed, it gets a highlight color. But as soon as the user rolls out, the onRollOut part kicks in a changes the color back to 'Y', while it should remain at 'Z' as long as no other button is clicked.

    This is a very basic problem, but I'm still asking. Is there a way to solve this easily? Do I need to start using booleans and if statements to fix this?

  2. #2
    1. onRelease set a variable to say that the button was the last one pressed
    2. for loop through the button to set them all to the Y colour
    3. set the saved button (the variable) to colour Z

  3. #3
    Ok, I think this might work. However, all buttons have different colors for rollover and rollout, only same color for released.

  4. #4
    Okay thanks Nathan, thanks to your advice if found a nice little workaround

  5. #5
    Okay well thaty was premature... It's like I shouldn't mess with the rollover and rollout states, they're fine as it is. It's more like I should stop the function from applying to the button movieclip as soon as it's pressed. And reinitiate it as soon as it's pressed again...

  6. #6
    Should work if it is a single button only, or repeating over several buttons, however if you want the highlight to dissapear after you click another button you need another, global variable.

    Pseudo:
    onRelease(this.highlighted = true
    color = color3
    )
    onRollOver(if(this.highlighted == false){
    color = color2
    }else{
    //do nothing)

    onRollOut(if(this.highlighted == false){
    color = color1
    }else{
    //do nothing)

  7. #7
    or

    onPress - set the variable (variable = this)
    onMouseUp - if the MC is the variable (this == variable) set the colour to Y, else (otherwise) set the colour to Z
    onRollOver - if the MC is not the variable (this != variable) set the colour to X
    onRollOut - if the MC is not the variable (this != variable) set the colour to Z

    does the desired results effectively?

  8. #8
    I did what Gigaboost suggested. However, now the rollover and rollout state stopped working. Is this because this.highlighted isnt defined as false before it has been released and set to true?

    Also, I need the highlight to dissapear when another button is clicked. Can that be done with an adition to this code, or does it need to be completely different?

    :edit:

    this is the code I'm working with. As you can see, I'm using mc tween for the color transitions:

    Code:
    function colorChange() {
        button0_btn.onRelease = function() {
            this.highlighted = true;
            this.shape_mc.ruit_mc.colorTo(0xFFFFFF,0.2,"easeInQuint");
            this.shape_mc.header_holder_mc.colorTo(0xff8043,0.2,"easeInQuint");
        };
        button0_btn.onRollOver = function() {
            if (this.highlighted = false) {
                this.shape_mc.ruit_mc.colorTo(0xbcbec0,0.2,"easeInQuint");
            } else {
                //
            }
            //this.shape_mc.header_holder_mc.colorTo(0xFFFFFF,0.2,"easeInQuint");
        };
        button0_btn.onRollOut = function() {
            if (this.highlighted == false) {
                this.shape_mc.ruit_mc.colorTo(0xE3E4E6,3,"easeOutQuint");
            } else {
                //
            }
            //this.shape_mc.header_holder_mc.colorTo(0xff8043,3,"easeOutQuint");
        };
        
        button1_btn.onRollOver = function() {
            this.shape_mc.ruit_mc.colorTo(0x959799,0.2,"easeInQuint");
        };
        button1_btn.onRollOut = function() {
            this.shape_mc.ruit_mc.colorTo(0xd2d3d5,3,"easeOutQuint");
        };
    
    
        button2_btn.onRollOver = function() {
            this.shape_mc.ruit_mc.colorTo(0x818385,0.2,"easeInQuint");
        };
        button2_btn.onRollOut = function() {
            this.shape_mc.ruit_mc.colorTo(0xbcbec0,3,"easeOutQuint");
        };
    
    
        button3_btn.onRollOver = function() {
            this.shape_mc.ruit_mc.colorTo(0x6D7072,0.2,"easeInQuint");
        };
        button3_btn.onRollOut = function() {
            this.shape_mc.ruit_mc.colorTo(0xa7a9ac,3,"easeOutQuint");
        };
    
    
        button4_btn.onRollOver = function() {
            this.shape_mc.ruit_mc.colorTo(0x57595B,0.2,"easeInQuint");
        };
        button4_btn.onRollOut = function() {
            this.shape_mc.ruit_mc.colorTo(0x939598,3,"easeOutQuint");
        };
    
    }
    Last edited by Vandenberg; July 5th, 2008 at 07:37 AM. Reason: code added

  9. #9
    oke by predefining the highlighted variable as false, both rollover, rollout and release work as they should.

    Now, as soon as another button gets pressed, the previously highlighted button should go back to his rollout state. You mentioned a glbal variable for that? How does it work?

  10. #10
    Are you working with 4 buttons, or are you working with indefinate number of buttons? A very simple solution would be to make 4 variables, 1 for each button and check them against eachother, however this is not optimal if you plan on using many buttons. Btw, you dont need to put this. in front of the variables since you are coding it on the timeline.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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

Home About kirupa.com Meet the Moderators Advertise

 Link to Us

 Credits

Copyright 1999 - 2012