Rollover on a label

Hi,
I have simple text buttons on my site and rather than do them
as a button I would like to use labels. The only problem is I
cannot get a rollover color to work. Can someone show me how to
change the color on a label in with a rollover.
Thanks,
H.

Besides doing this in ActionScript, you can define FX
sequences in MXML and using the label's rollOverEffect and
rollOutEffect triggers to run them. The code below is an example
that changes the color, fontWeight and textDecoration styles on the
label control.

Similar Messages

How do I ignore a rollover on text object?

The following code builds a custom button. It has a bug. The hand cursor becomes a mouse pointer and the rollout state is activated when I roll over the overlapping Label:
1. How can I ignore a rollover on the Label?.
2. How can I make the hand cursor remain in place while I roll over any part of the HBox (including the Label)?
Thank you!
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()"   buttonMode="true"
    useHandCursor="true">
<mx:Script>
    <![CDATA[
import mx.events.FlexEvent;
[Bindable]        public var buttonTitle:String;
    public function init():void{
        hbox.width=textField1.width;
        hbox.height=40;
        fillDark()
        hbox.addEventListener(MouseEvent.MOUSE_OVER, handleRollOver)
        hbox.addEventListener(MouseEvent.MOUSE_OUT, handleRollOut)
    private function handleRollOver(e:MouseEvent):void{
        fillLight();
        textField1.styleName="sectionsButtonOver";
    private function handleRollOut(e:MouseEvent):void{
        fillDark();
        textField1.styleName="sectionsButton";
    private function fillDark():void{
        hbox.graphics.beginFill(0x2b2b2b)
        hbox.graphics.drawRect(0,0,this.width-1,40)
        hbox.graphics.endFill()
        hbox.graphics.beginFill(0x414141)
        hbox.graphics.drawRect(this.width-1,0,1,40)
        hbox.graphics.endFill()
    private function fillLight():void{
        hbox.graphics.beginFill(0x3f3f3f)
        hbox.graphics.drawRect(0,0,this.width-1,40)
        hbox.graphics.endFill()
        hbox.graphics.beginFill(0x414141)
        hbox.graphics.drawRect(this.width-1,0,1,40)
        hbox.graphics.endFill()
    ]]>
</mx:Script>
<mx:HBox id="hbox" buttonMode="true" useHandCursor="true" />
<mx:Label id="textField1" text="{buttonTitle}" y="13" selectable="false" buttonMode="true" useHandCursor="true"
     styleName="sectionsButton" />
</mx:Canvas>

Thanks for your reply. I modified your suggestion and set the following properties on a Canvas that I used as a wrapper:
<mx:Canvas id="cover" width="100%" height="100%" mouseChildren="false" buttonMode="true" useHandCursor="true" >
</mx:Canvas>

Target ComboBox label color on MouseOver or RollOver

I am having a hard time figuring out how to change the label color of a combobox on rollover prior to clicking the combobox to make a new selection. I understand how to set the color of the label, how to change the textRollOverColor, textSelectedColor, etc, but setting the current label color for a combobox is stumping me.
Thanks in advance.

I'm not sure how this could be done using style tag.. if possible then ignore this solution..
Well, you need a custom ComboBox that extends from the base ComboBox.. as below..
package src
import flash.events.MouseEvent;
import mx.controls.ComboBox;
public class ExtendedCombo extends ComboBox
public function ExtendedCombo()
super();
protected override function createChildren():void
super.createChildren();
textInput.addEventListener(MouseEvent.ROLL_OVER, onTextMouseOver);
textInput.addEventListener(MouseEvent.ROLL_OUT, onTextMouseOut);
private function onTextMouseOver(event:MouseEvent):void
textInput.setStyle("color", "0xff0000");
private function onTextMouseOut(event:MouseEvent):void
textInput.setStyle("color", "0x0B333C");
hope this helps,
BaBo,

Label rollover

Is there a function that will allow a blurb to popup when you
rollover a Label? I have a label called [What is this]. When I roll
over it I want a bubbly/blurb to pop-up that will explain what that
that field is. Does anyone know how to do this?

Hi,
I don't know what is a blurb but if you want to display an
help message when the mouse is over a label, you can set the
tooltip attribute.
E.g. <mx:label toolTip="my help message" />
David

Why is my image rollover not working in Firefox?

I am starting a new site. In the middle of the page on the right, I have a simple image rollover effect for the UPCOMING EVENTS button. It is also supposed to link to another page (not designed yet). It works in Explorer, not in Firefox. How can I fix this? I suppose I can revert to javascript but it adds a lot of coding to the page. I don't know what to do.    http://jeannettedutton.com/MLVC/

In Menu.css, change this -
#MenuBar.MenuBar .SubMenuVisible {/* For Horizontal menubar only */
    top: 100%; /* 100% is at the bottom of parent menuItemContainer */
    left:0px; /* 'left' may need tuning depending upon borders or padding applied to menubar MenuItemContainer or MenuItem,
                    and your personal taste.
                    0px will left align the dropdown with the content area of the MenuItemContainer. Assuming you keep the margins 0
                    on MenuItemContainer and MenuItem on the parent
                    menubar, making this equal the sum of the MenuItemContainer & MenuItem padding-left will align
                    the dropdown with the left of the menu item label.*/
    z-index:0;
    overflow:visible;
to this -
#MenuBar.MenuBar .SubMenuVisible {/* For Horizontal menubar only */
    top: 100%; /* 100% is at the bottom of parent menuItemContainer */
    left:0px; /* 'left' may need tuning depending upon borders or padding applied to menubar MenuItemContainer or MenuItem,
                    and your personal taste.
                    0px will left align the dropdown with the content area of the MenuItemContainer. Assuming you keep the margins 0
                    on MenuItemContainer and MenuItem on the parent
                    menubar, making this equal the sum of the MenuItemContainer & MenuItem padding-left will align
                    the dropdown with the left of the menu item label.*/
    z-index:999;
    overflow:visible;

How to create a dropdown menu with sub buttons that link back to the labels on click.

im trying to create a dropdown menu buttons that when you rollover to the top central button the button it opens up like a drop down menu would containg two other subsectional buttons. This makes the sub sectional buttons seperate from the main stage making it difficult to simply give them a on click, sym.play("label") function.
the buttons work like this in symbols or sections stage/panel/homebutton inside home button is group dev containg another group dev containg the button which I need to link back to a "label" in the /panel/ symbol or section. Thank you very much.

pdp_1 wrote:
Hi!
I would like to create a DVD menu that offers two languages. So the first page gives two options: Language 1 and Language 2. Then depending on which language you choose, you go to a menu that proposes different videos and a photo slideshow.
Regardless on which language button you click on initially, you get the same content but in different languages.
I've been looking at Premiere's templates, which I can certainly customize, but I really don't see how to create the double menu. Does anybody have an idea?
Put the video with the first language on the timeline followed by the video with the second language. Use chapter markers so you can have each video as a chapter in the menu.
I use Premiere Pro, so I can't give more specific directions. Perhaps somebody like ATR will chime in.
Also, I have another question: can I put videos from different projects in the same DVD with Premiere or must all of the videos that go into the DVD be in the same project?
Thank you very much!!!
pdp1
They must be in the same project.

Show end of label text when String is too long

I have a JLabel with a string in it, but the string is too long for the label, and only the first part of the string is visible.
How can I make the label show the end of the string?

I use the field as a rollover helper. When the mouse rolls over a cell or column in a table, it shows the value in the textfield.
Now, when the field gets a new value, it flickers because it first enters the string and shows it from the beginning and then scrolls to the end, causing a flicker.
Is there any way I can get around this?

Streamlining the code for the button group with individual links and rollover imgs

I am looking for a solution to streamline the code for the array of 20+ buttons located inside the scroll pane.
I know I can make an array if all the buttons would have a unified code executable change, i.e. they would become larger and brighter.
My problem is that each button represents an product image in the lights off stage, then of rollover it is a lights on stage so I have to import two images in the on and off stage and play around with the opacity.
Additional problem is that each button has to ling to a different label.
My question is: is it possible to unify the code if buttons have that much individuality or I have to make each one of them as in the example below.
// makes a hand cursor appear over a mc acting as a button for all the buttons inside the scrollpnaeBckgrnd_mc.scrollpaneBckgrnd_btns_mc.
MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.buttonMode = true;
MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.useHandCursor = true;
///////////////INDIVIDUAL BUTTONS
          MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.FloraLyte _btn.FloraLyte_ON.alpha = 0;
                    var FloraLyte_btn_Tween:TweenLite = TweenLite.to(MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.F loraLyte_btn.FloraLyte_ON, .5, {alpha:1, paused:true});
                    MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.Flor aLyte_btn.addEventListener(MouseEvent.ROLL_OVER, overHandler_FloraLyte_btn);
                    MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.Flor aLyte_btn.addEventListener(MouseEvent.ROLL_OUT, outHandler_FloraLyte_btn);
        MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.FloraLyte_btn. addEventListener(MouseEvent.CLICK, onClick_floralytePopUp);
                  function onClick_floralytePopUp(event:MouseEvent) :void {
                                        gotoAndPlay("floralytepp");
function overHandler_FloraLyte_btn(e:MouseEvent):void{
         FloraLyte_btn_Tween.play();
         trace("you rolled over me");
function outHandler_FloraLyte_btn(e:MouseEvent):void{
         FloraLyte_btn_Tween.reverse();
         trace("you rolled off me");
MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.FloraLytell_btn .FloraLytell_ON.alpha = 0;
                    var myTween:TweenLite = TweenLite.to(MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.F loraLytell_btn.FloraLytell_ON, .5, {alpha:1, paused:true});
                    MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.Flor aLytell_btn.addEventListener(MouseEvent.ROLL_OVER, overHandler);
                    MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.Flor aLytell_btn.addEventListener(MouseEvent.ROLL_OUT, outHandler);
        MovieClip(mc_pane2.content).scrollpaneBckgrnd_mc.scrollpaneBckgrnd_btns_mc.FloraLytell_bt n.addEventListener(MouseEvent.CLICK, onClick_floralytellPopUp);
                  function onClick_floralytellPopUp(event:MouseEvent) :void {
                                        gotoAndPlay("floralyte2pp");
          function overHandler(e:MouseEvent):void{
         myTween.play();
         trace("you rolled over me");
          function outHandler(e:MouseEvent):void{
         myTween.reverse();
         trace("you rolled off me");

as ned suggested, plan your flow and code into it. here is one example:
var buttonArray = [someButton, someOtherButton, aDifferentButton];
for(var i = 0; i < buttonArray.length; i++){
     //get reference to county movieclip
     var mc = buttonArray[i];
     //then add listeners
     mc.addEventListener(MouseEvent.ROLL_OVER, overMe);
function overMe(e:MouseEvent){
     var mc = e.target;
     switch(mc){
          case: someButton:
                   someOtherButton:   doThis();
                                                 break;
          case: aDifferentButton:     doThat();
                                                 break;
          default:                            //do nothing;
                                                 break;
function doThis(){
     trace("do this")
function doThat(){
     trace("do that")

Horizontal Menu Bar Rollover image

I have been slowly piecing together some Horizontal Menu Bars
by learning from the code on this page...
http://labs.adobe.com/technologies/spry/samples/menubar/MenuBarSample.html
keeping that in mind my code is probably wrong in a number of
ways. The problem that I have run into and cant seem to solve on my
own is that I want one of my Horizontal Menu bars to have rollover
images only on the primary level. If you follow the link below you
can see what I have done thus far. The "tabs" are images and I want
them to rollover to another image, which is just the same tab in a
darker shade of grey. The tabbed menu bar is labeled MenuBar2 in
the code
http://www.du.edu/~dborges/test1.html
The other problem I’ve been having with both menu bars
is the way they appear in IE... it looks great in everything else.

Hi Beth, I have been going crazy on this end with the Sub Menus showing up at the top of the Internet Explorer Browser. They work fine in FF and Chrome...
I have CS4 and tried reading everything possible.... here is my page. I am normally pretty good at resolving these issues but I'm going nuts.. ha!
http://www.ilovemydogfans.com/index-testdrops
Thank you for any assistance you can provide. I would be forever grateful!
Dave
David Abbott
I Love My Dog
[email protected]

PSD Rollover Button with image in front stops button from changing state

I have a wide PSD button that changes state when rolled over. I would like to place a PNG image with transparency in some areas over the top of it so that the rollover button shows through the transparent areas of the PNG.
How can you get it to do the rollover effect when the user mouses over the bit of the button that the image is in front of? Is ther a way of making the PNG 'invisible' to the mouse?
I know I could redesign the button so that it includes the image but I'm trying to keep file sizes and load times to a minimum, I use this button a lot on my website with a different on each, and having that number of individual buttons would result in a bloated, slow-loading website.

Hi Abhishek
Thanks for your reply. I was able to achieve the effect I wanted by having the PNG and the PSD Button with the same link and then grouping them. This means I can mouse over the PNG and still get the PSD rollover effect, which is perfect.
However I also have another similar problem. I have some different PSD Rollover Buttons which have some text in front of them (basically it's the button label). On some of these buttons when you roll over the text it prevents the rollover state of the button, and on other buttons the rollover effect occurs as it should, and there doesn't appear to be any consistency about which does what. Grouping or ungrouping doesn't appear to make a difference. Can you help?

Is there a way to use a text field as a rollover?

I have a PDF that contains tables with bullets in them. I would like the end user to be able to rollover a bullet and have a part number appear.

It's easier to use buttons, either by taking advantage of their rollover label, tooltip text, or by controlling the visibility of another button as demonstrated with the following sample: https://acrobat.com/#d=aP-2xL45pM57xVkT6d6fSg

Rollover and click event with symbols keyframed in timeline

Concerning the active state of rollover(mouseenter/mouseleave) buttons in Edge. I've set up a grid style animation with symbols.
I've got the composition, triggers, labels, mouseenter and mouseleave with symbols working just the way I'd like but my issue is keeping the button active after clicking and the mouse leaving. As it is now, when the mouse is clicks it plays the animation I want but when the mouse leaves the button doesn't stay 'active' indicating the portion of the grid the user is seeing. And adversely when the user clicks a different button the previous 'active' button needs to be 'inactive'. I'm useing keyframes of the color value, black to white, white to black with labels on the timeline.
What is the method or code to accomplish this?
Below is pics of my actions.

Concerning the active state of rollover(mouseenter/mouseleave) buttons in Edge. I've set up a grid style animation with symbols.
I've got the composition, triggers, labels, mouseenter and mouseleave with symbols working just the way I'd like but my issue is keeping the button active after clicking and the mouse leaving. As it is now, when the mouse is clicks it plays the animation I want but when the mouse leaves the button doesn't stay 'active' indicating the portion of the grid the user is seeing. And adversely when the user clicks a different button the previous 'active' button needs to be 'inactive'. I'm useing keyframes of the color value, black to white, white to black with labels on the timeline.
What is the method or code to accomplish this?
Below is pics of my actions.

How to make edges of rollover button straight

I was using rollover pjc in my forms....
I am setting these properties of the buttons...
--> setting the 'label' property to [ROLLOVER]add
--> setting 'implementation class' property to
'oracle.forms.demos.enhancedItems.RolloverButton'
My rollover buttons are dislayed with rounded edges....
I want to make the edges of my rollover buttons
straight(like sqaure edges). please let me know how do i do that.
Thanks in advance

Judging by the source code of RolloverButton.java, it looks like that demo will always use rounded buttons.
If you want normal shaped buttons, then you should modify RolloverButton.java or create your own Java class based on it and change it. The change should be to not use setLeftmost(true) and setRightmost(true). By setting them to true you are telling the button to treat the button as if it's the leftmost or rightmost button, which will round that end (or both).
Regards,
Robin Zimmermann

Some nagging CSS image rollover questions

Hi,
I'm using DW CS4 here. I finally got a Top Horizontal Inline CSS navigation to work with CSS image rollovers. Here's the site:
http://www.brightbeltmusic.com
And here are my questions:
-Why, when my original images are 90 px wide x 30 h, do I have to cut the width in the code to 84 px to make things line up?
-I can't seem to set the images by obvious pixel widths - any little thing throws the whole navigation onto the next line and so I have to set the 'Up' image as a repeating background, while shortening the actual image link itself. Is this right? It seems to "work" here but maybe barely.
-Padding seems to always be set in 'ems' - so how many pixels are in an 'EM' ? This is so I can figure out the width issues I always seem to have when I want horizontal rollover images...
-Margin for a # ul apparently effects the very end/outside of the list....Is there such a thing as margins for the individual # li ?
I guess I need a good pointing to a image rollover tutorial for Horizontal inline navigation.
Many Thanks for any help. It just seems like I play a guessing game on the pixel details when I'm trying to construct these types of mavigation.
Thanks, Frank B.

brightbelt wrote:
Hi,
I'm using DW CS4 here. I finally got a Top Horizontal Inline CSS navigation to work with CSS image rollovers. Here's the site:
http://www.brightbeltmusic.com
And here are my questions:
-Why, when my original images are 90 px wide x 30 h, do I have to cut the width in the code to 84 px to make things line up?
Probaby because you are not taking into account padding, borders and margins which add to the width of the container/s
brightbelt wrote:
-I can't seem to set the images by obvious pixel widths - any little thing throws the whole navigation onto the next line and so I have to set the 'Up' image as a repeating background, while shortening the actual image link itself. Is this right? It seems to "work" here but maybe barely.
Mathematicis is critical to the set up. As stated padding and borders, margins etc add to the overall width of a container. So if the containers are too wide to fit in a specific width they will be thrown to the next available space, usually to the next line.
Example: a container which is set at a specific width of 90px and has padding left and right of say 8px is really 106px wide. Therfore if you're trying to allocate space for 6 buttons where each is 90px wide and has 8px padding left/right you need to allocate a space 6 x 106px plus any borders.
brightbelt wrote:
-Padding seems to always be set in 'ems' - so how many pixels are in an 'EM' ? This is so I can figure out the width issues I always seem to have when I want horizontal rollover images...
Personally I would never recommend setting padding in ems. Certainly ems and px don't mix and match very well.
brightbelt wrote:
-Margin for a # ul apparently effects the very end/outside of the list....Is there such a thing as margins for the individual # li ?
li's do have default padding and margins set so these need to be zeroed out.
li {
margin: 0;
padding: 0;
As an experiment copy all the code below, open a new Dreamweaver document and paste it into code view, save it to your site folder with the name navigationTest.html. Run it through a browers and see what the results are like.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
#navcontainer {
width: 775px;
margin: 0 auto;
background-image: url(navUp.gif);
background-repeat: repeat-y;
overflow: hidden;
#navcontainer ul {
width: 547px;
padding: 0;
margin: 0 auto;
background-image: url(navUp.gif);
#navcontainer ul li {
width: 90px;
float: left;
margin: 0;
padding: 0;
list-style: none;
#navcontainer ul li a {
background-image: url(navUp.gif);
background-repeat:no-repeat;
color: #fff;
text-decoration: none;
font-weight:bold;
width: 90px;
display: block;
text-align: center;
float: left;
border-right: 1px solid #069;
padding: 5px 0;
font-family: arial, helvetica, sans-serif;
font-size: 14px;
</style>
</head>
<body>
<div id="navcontainer">
    <ul>
    <li><a href="index.htm" style="border-left: 1px solid #069;">Home</a></li>
    <li><a href="Contact_Us.htm">Contact</a></li>
    <li><a href="Profiles.htm">Profiles</a></li>
    <li><a href="Catalogue.htm">Songs</a></li>
     <li><a href="BBL.htm">BBL Label</a></li>
    <li><a href="Jazz_links.htm">Links</a></li>
    </ul>
</div>
</body>
</html>

Make button appear and pause slide after rollover slidelets have been rolled over?

Hello,
I am trying to use advanced conditional and standard actions in order to prompt a user to rollover 5 rollover slidelets before a "continue" button appears. I have attached variables to each rollover slidelet, created the button and marked it as invisbile, and have created a contitional action but I'm not sure where to attach the action:
Am I using an extremely complicated method to do something so simple? I have tried various methods, get close, but then the project continues to the next slide when it should pause until the continue button is clicked even though the property "Pause project until user clicks" is checked.
Thanks for all of your help and let me know if there's any additional information I can provide!

Hello,
I have described that work flow multiple times, mostly with clicks instead of rollovers but slidelets have two events, one of them is the rollover itself. So you'll have to trigger the conditional action with that event. But as Rod points out, the mimicked standard action (first decision) should focus only on that rollover and assign the value 1 to that boolean variable (don't increment, has no real sense). Then the condition will have a AND combination to check all the values, and show the button only in that case. You will have 5 similar conditional advanced actions, one for each rollover event. But since they will be almost identical (only the boolean variable label has to be changed), duplicating and editing that action will not take a long time. If you were on CP7 you could use a shared action, but duplicating will even there be the quicker solution IMO.
In this old blog post you'll find such an example (witth clicks as events)=
http://blog.lilybiri.com/template-for-reusing-script
Lilybiri

Rollover on a label

Similar Messages

Maybe you are looking for