Using Javascript to change the color of a button

Hello

I am changing a button from blue to red when selected.

The button is named myShape.

I tried:

this.myShape.style.color = "FF0000";

but no go.

I also tried just setting the myShape as a clip instead of a button, but no go.

The function of the button works as I have an alert is triggered when the button is clicked.

Thank you

Do you want to change the button color as long as it is which is clicked, or discoloration permanently after summer on it?

If you just want to change while the click occurs, it's super easy with a button symbol: How to create buttons with Adobe animate (you would simply adjust the "low" State to be of whatever color you want.)

If you want to permanently change, you could create a clip below an invisible button, and when the button is clicked you might it have to reach a specific image in the clip. in this image, you can use a shape tween to change the color of the shape of button, or you can simply use a keyframe to set the color of what you want it to be.

Here is a small example of work of two of these options: https://www.dropbox.com/sh/jnrerw6suqfmpu6/AACC8_yuznQzf7h3esVU5VXya?dl=0

Tags: Adobe Animate

Similar Questions

  • How to use JavaScript to change the named view

    How to use JavaScript to change the named view

    Do you mean to jump to a specific Destination named within a PDF file? SE so there

    the method gotoNamedDest of the Document object.

  • How to permanently change the color of a button

    I use an action to change the color of a button.  It works but the color changes for only about a second and then back to the original color.  How can I make the color change permanently?

    Sigh, if a question was clear, that he would not take as long to get a response. I knew there was more than simply by changing the color of a button, where my questions.

    Personally, I would never trust effects for this particular case. They do not always work as expected and even less in 8.0.1 then 7. In addition, as this has always been the case, the application of effects by a step (or shared action) has a lot of limitations, because you cannot set the duration of effect, or specify the path, if it is a motion effect. The only solution that I found and explained a long time ago was to create a custom effect to apply. But the workflow is quite heavy: first he must create the effect based on time with the correct time and settings, then you can save it, but it won't be available immediately in the drop-down list in the dialog of AA. You must apply the effect custom time once, before it becomes available. BTW, the default duration of the tint to apply is 2secs, which cannot be changed in the AA dialog box.

    I don't see your response to Ajit, for some reason, maybe because it is personal and I am just a user. My approach would be to replace the original button with a touch of the color that you want, something as I used in the dashboard in this blog: Captivate 8 - first adventures - Captivate blog

    Forums act as strangely today as effects in Captivate, now the answer to Ajit popped up.

    Text buttons will always have the appearance of the system buttons, you can not change their color. It can be done with text buttons but once again, I never use them more because the form buttons appeared. Those are much easier to style and offer more choices. Furthermore they can be used on master slides and timed for the rest of the project, and you can even insert on Question slides.

  • Change the color of text button overview

    Hello

    I used text buttons in my project and I want to change the color of overview. How can I do?

    I couldn't find anything in the style!

    Thank you

    Buttons text takes up the style of the buttons system, you can't control them at all.

    Best way would be to replace the text by form buttons buttons, which you can style so that they perfectly resemble text buttons, but you can control the style of the three States. I recommend to do with the object Style (on CP8) Manager.

    Transparent buttons don't have any rollover State, you can also use image buttons but then you must create three different images with proper nouns, such as image buttons you have included in the CP.

  • Change the color of a button

    How I can change (on the Enter event) the color of a button text another color and vice versa by default at the exit.

    Effect of links

    Thank you

    You can use this.caption.font.fill.color.value to change the color of the text. I did using the mouseEnter/mouseExit events to create a substitution effect.

    Come in:

    This.Caption.font.Fill.Color.Value = "255,255,255"; White

    Output:

    This.Caption.font.Fill.Color.Value = "0,0,0"; Black

  • Change the color of a button programmatically

    I would change the background (or fillColor?) a button programmatically. Methods to achieve that documentation do not seem to work. For example, the following code to change the color of the button with the id buDel does not produce an error but also, it does not change the color of the button:

    buDel.setStyle ("fillColor", "#e5507a");

    I also tried this using the backgroundColor attribute in the setStyle method.

    Hello

    You can use a button skin. Please go through the following links:

    1) http://www.asfusion.com/blog/entry/stateful-skins-in-flex-3e-color-transitions-in-buttons--opportunity

    2) http://livedocs.adobe.com/flex/3/html/help.html?content=skinning_5.html

    ( http://www.davidflatley.com/2007/12/17/programmatic-button-skins-in-flex-3/ 3)

    Thank you and best regards,

    ------------------------------------------------------------------------------------------ --

    Vibhuti Gosavi . [email protected] | www.infocepts.com

    ------------------------------------------------------------------------------------------ --

  • change the color of radio button

    Hi guys

    How can I change the color of a white radio button. I tried to add a class, but his does not work.

    V thanks a lot in advance

    Hi Ken and DottyDog,

    It's true, and it's Roger Johansson aka "456 Berea Street" always points back. And so it is really therefore also read its general articles.

    Hans G.

  • Change the color of a button when clicked

    Hi all

    I'm relatively new to Adobe Captivate and created buttons that allow a users through each step with a new screen that appears. I would like to implement the buttons so one a user has clicked on one of the steps that it changes color to show that summer above.

    Is it possible through Captivate? And if so, how do I go about this?


    Thanks a lot for your help!

    Amanda

    The best way to achieve this is simply having two buttons in exactly the same position on the slide.  Define their colors you want.

    One button begins hidden and another begins illustrated (Visible in the output selected in the Properties tab).  When we click the button it needs to run a standard or advanced conditional action rather than just a single action as this will allow you to do more than one thing.  Whatever you want the button is one thing, the second thing, it's to hide the already visible button and display it previously hidden, this has the effect to make it look like the button has changed color when in fact you actually replaced by one single button for another.

    I would say the best type of button to use in this situation would be a form of Smart serve the value button.

  • Change the color of a button/box/radiobutton...

    How I would approach (even if it's through actionscript) change the Green by default "glow" on the components button, checkbox and radiobutton to the color #B50C00? Thank you!...

    Nevermind - got it! :

  • Can I use Paint to change the color of the text in a jpeg file?

    That covers it pretty well.  Also, can I put a background color in without the text being covered?

    Hello

    If the text already exists in the image, then you cannot delete/edit it in paint. Yes, it is possible but requires a little extra work, you can use third-party application to make changes in the jpeg file. I suggest you research on the use of your favorite search engine.

    WARNING OF THIRD PARTY LINK.
    WARNING: Using third party/link software, including hardware drivers can cause serious problems that may prevent your computer from starting properly. Microsoft cannot guarantee that problems resulting from the use of third-party software can be solved. Software using third party is at your own risk.
  • Change the color of a button when you click on it in multiple colors

    Ive been given the task of creating a map for a major renovation of our hotel. I have limited experience in Acrobat and so all the reccomondations script would be greatly apprecated.

    I need to create a pdf file that management can click on a button/box (just something to cover the room) and be able to cycle although three colors independently to see quickly what the State of each piece. There are 884 rooms on eight floors. Ive fixed a section of one of the floors. Thanks in advance for any help.

    Level Four Section.jpg

    So let's say you have a button called "Room1". Set its fill color to red (most of the columns and rows from center left) and add this code as its MouseUp JavaScript action:

    var field = getField ("Room1");
    If (color.equal (field.fillColor, color.red))
    field.fillColor = color.green;
    ElseIf (color.equal (field.fillColor, color.green))
    field.fillColor = color.blue;
    ElseIf (color.equal (field.fillColor, color.blue))
    field.fillColor = color.red;

    If you need to apply it to several areas, you can create a script doc-level, as follows:

    function switchColor (fName) {}

    var field = getField (fName);
    If (color.equal (field.fillColor, color.red))
    field.fillColor = color.green;
    ElseIf (color.equal (field.fillColor, color.green))
    field.fillColor = color.blue;
    ElseIf (color.equal (field.fillColor, color.blue))
    field.fillColor = color.red;

    }

    and then each button MouseUp action simply call you the function with the name of the button as a parameter:

    switchColor ("Room1");

  • change the color of solid red color normal (default)...

    Hi guys,.

    IM used javascript to change the color of the border of the normal (default) in red.
    document.getElementsByName("f01")[0].style.border="3px red solid";
    My intention is to change the color of solid red color normal (default).
    i.e. on blur I want to change red to normal (default) color.

    Y at - it no javascript?

    Thanks in advance.

    Hello

    This might help
    http://www.java2s.com/Tutorial/JavaScript/0440__Style/Removeastylevaluebypropertyname.htm

    And if you're on Apex 4 or using jQuery addition and deletion of style are even simpler.
    http://API.jQuery.com/CSS/

    Kind regards
    Jari

  • change the color to buttons

    Hello

    I have a series of buttons placed side by side. I'm changing the focus from one button to another using the navigation keys. Now the problem is the update is not clearly visible. Is there a possibility to do?

    I had an idea to use the option of color change, when the focus is on a button changes color to some specific color and the rest in a few other specific colors. But I am not able to implement clearly. so please give me an idea...

    Thanking you,

    sushmith

    If you want to change the color of a button, you must watch what kind of button that you use.  Not all the buttons can have their changed colort.

    If you are looking for a professional to look at it, you don't want to do a colorbook either by changing each button in a different color.

    What you can do is put behind each button an LED indicator that is slightly larger then the button itself.

    When the button has the focus, set the indicator.  And it will turn on.

    It's a little more work, but it looks so much nicer.

    Personally, I don't like to mess with colors.  I like the simplicity.  That's why I use systembuttons, who already have a blue surface when they have developed

    Hope this helps

  • How to change the color of the text by 1 point in the bulleted list?

    Hello

    I'm having some difficulties and I hope that someone can help you. I used for my menu bar, originally a reference to a door list not ordered so if I had to change something in the world I could do it by simply changing the bottommenubar shtml file.  In my CSS file, I set it up to look like I want it (see CSS below).  However, I would like that text is appropriate in the menu bar to be a different color when someone is on this page.  In other words, when on the home page, I want the Word home in the menu bar to be a different color than the other words/sections in the menu bar.

    So first of all, I guess I can't use the include statement and I will just have to put the unordered list below in each file .htm for each page and then use CSS to change the color of the word/link in the list of the individual page.  However, I was unable to find a way to do it.  I created a class for the color of the text (.pinktext) and tried to apply it to this word/line to the ul.  But it does not work.  I also changed the bottommenubar to a class rather than and ID and it has not always worked.  I put the lowest .pinktext code in the CSS file.  I apologize if this is a stupid question.  But any help would be appreciated.  So I would like to know if I'm mistaken, I can't use includes it the file (keep the non ordered list in a separate file) if I want the word/link to a different color for different files.  and number two, how can I change the color of the text for one item in the list. Thanks, Kirk

    The code in my file htm that links to the menu bar file (which I guess I can't use now)

    < div id = "bottommenubar" >

    "<!--file="Spry-UI-1.7/includes/bottommenubar.shtml #include "--> < / div >

    < / div >

    My bottommenubar shtml file is something like this (just included a few lines).

    < ul >

    < li > < a href = "index.htm" title = "Link to the Home Page" > home < /a > < /li > "

    < li > < a href = "news.htm" title = "Link to the Page of news" > News < /a > < /li > "

    < li > < a href = "biography.htm" title = "Link to the biography" > biography < /a > < /li > "

    < /ul >

    Since I don't think I could use since I want different color for different pages, I put this in my main file (also tried pinktext first with like an ID (and # used in my CSS code instead of) and added class of Home button, but it does not work.)

    < div class = "bottommenubar" >

    < ul >

    < li > < a href = "index.htm" title = "Link to the homepage" class = "pinktext" > home < /a > < /li > "

    < li > < a href = "news.htm" title = "Link to the Page of news" > News < /a > < /li > "

    < li > < a href = "biography.htm" title = "Link to the biography" > biography < /a > < /li > "

    < /ul > < / div >

    My CSS code when I tried as a class instead of ID is:

    {.bottommenubar}

    height: 20px;

    do-family: Arial, Helvetica, without serif.

    do-size: 18px;

    padding-top: 190px;

    }

    .bottommenubar ul {}

    list-style-type: none;

    Width: 960px;

    margin-right: auto;

    left margin: auto;

    }

    .bottommenubar ul li a {}

    do-family: Arial, Helvetica, without serif.

    do-size: 18px;

    color: #999;

    text-decoration: none;

    display: block;

    float: left;

    padding-right: 8px;

    padding-left: 9px;

    }

    .bottommenubar ul li a: hover {}

    list-style-type: none;

    color: #fc6;

    }

    {.pinktext}

    color: #f0f;

    }

    Ok.  What is your a: visited style?  Unless you disable the history/cache of your browser, you will see the style of default history for all the visited - links which are purple by default.

    Nancy O.

  • How to change the color of the same colored sections of an image according to the colorpicker. ?

    Hello.. How are you all... ?


    I do a small program to change the color of these sections of an image that have the same color, according to the chosen of the colorpicker color...


    Say of the colorpicker, we selected a color, and then mouse click on the image event changes the color of those parts of the image that have the same color as the selected portion (or pixel) to the selected color... If we have selected FF0000 in the colorpicker and then clicked 3300CC color pixel in the image. This should change the color of all pixels of color-3300CC in the image...

    I have a colorpicker [colpickr] and a movieclip [mc] the image on the stage. I created a bitmap of the same image (imag1) using the code. Select the color in the colorpicker and a mouse click on the movieclip (here I used getPixel) will change the color in the bitmap image to the selected (with setPixel) color. I have two images; one is a movieclip (inorder to add the listener for the click event), and one is a bitmap (to set the setPixel property). But I need a single image.

    Please help me with this... Below is my code (horrible)...

    import flash.events.MouseEvent;

    Import 12345678910111213import;

    import flash.display.BitmapData;

    import flash.net.URLRequest;

    import flash.display.Loader;

    var c = 0;

    var myBitmapData:BitmapData;

    var bm:Bitmap;

    colpickr.selectedColor = 0xffffff;

    preLoader var;

    var urlReq;

    var preloader_img:MovieClip;

    preLoader = new Loader();

    preLoader.unloadAndStop ();

    urlReq = new URLRequest ("imag1.jpg"); I chose the same image as that of movieclip mc

    preLoader.load (urlReq);

    preLoader.contentLoaderInfo.addEventListener (Event.COMPLETE, preLoaderComplete);

    creates a bitmap of mc...

    function preLoaderComplete(loadEvent:Event) {}

    myBitmapData = new BitmapData (mc.width, mc.height);

    myBitmapData.draw (mc);

    BM = new Bitmap (myBitmapData);

    addChild (bm);

    BM. Width = mc.width;

    BM. Height = mc.height;

    }

    mc.addEventListener (MouseEvent.CLICK, _onMouseClick);

    Gets the color of mc and affects the color bitmap

    function _onMouseClick(event:MouseEvent):void {}

    var myColor:uint = myBitmapData.getPixel (mc.mouseX, mc.mouseY);

    c = myColor.toString (16);

    for (var i = 0; i < bm.width; i ++) {}

    for (var j = 0; j < bm.height; j ++) {}

    If (myBitmapData.getPixel(i,j).toString (16) == c) {}

    myBitmapData.setPixel (i, j, colpickr.selectedColor);

    }

    }

    }

    }

    Try this:

    import flash.events.MouseEvent;

    Import 12345678910111213import;

    import flash.display.BitmapData;

    import flash.net.URLRequest;

    import flash.display.Loader;

    var c = 0;

    var myBitmapData:BitmapData;

    var bm:Bitmap;

    colpickr.selectedColor = 0xffffff;

    preLoader var;

    var urlReq;

    var preloader_img:MovieClip;

    preLoader = new Loader();

    preLoader.unloadAndStop ();

    urlReq = new URLRequest("z_bitmaps/image1.jpg"); / / I chose the same image as that of movieclip mc

    preLoader.load (urlReq);

    preLoader.contentLoaderInfo.addEventListener (Event.COMPLETE, preLoaderComplete);

    creates a bitmap of mc... ;

    function preLoaderComplete(loadEvent:Event) {}

    BM = Bitmap (loadEvent.target.loader.content);

    addChild (bm);

    }

    stage.addEventListener (MouseEvent.CLICK, f);

    function f(e:MouseEvent):void {}

    If (BM.hitTestPoint (MouseX, MouseY) &! colpickr.hitTestPoint (mouseX, mouseY)) {}

    _onMouseClick (e);

    }

    }

    Gets the color of mc and affects the color bitmap

    function _onMouseClick(event:MouseEvent):void {}

    c = BM. BitmapData.GetPixel (BM. MouseX, BM. MouseY);

    for (var i = 0; i)

    for (var j = 0; j)

    If (bm.bitmapData.getPixel (i, j) == c) {}

    bm.bitmapData.setPixel (i, j, colpickr.selectedColor);

    }

    }

    }

    }

Maybe you are looking for