Video Screencast Help
Symantec to Separate Into Two Focused, Industry-Leading Technology Companies. Learn more.

Change Button Attributes onmouseover

Created: 05 Sep 2013 • Updated: 05 Sep 2013 | 4 comments
This issue has been solved. See solution.

I'm trying to use the custom events to change button attributes (background color, text color, etc) on mouseover. Is this the correct way of doing it? If so, what is the javascrip syntex for this? Can I also hide a button/label on mouseover?

Operating Systems:

Comments 4 CommentsJump to latest comment

reecardo's picture

Absolutely you can. The following will hide a button if you mouseover it.

1. Give the button a ControlID of your choosing. I'll use 'blah' (don't use quotes in the Designer)

2. Add an Custom Event to the button. Choose mouseover as the event, then use the following JS:

var mybutton = document.getElementById('blah');

mybutton.style.display = 'none';

Note you probably want to add a onmouseout function (or some other function) to reshow the button... JS is similar to the above but just set style.display = '';

Changing textcolor is very similar to the above. You'd just use style.color = '#abcdef', where abcdef is the hex value for the color (use google to track down the value for the color you need)

The main thing that's important is to provide ControlIDs for whatever control you want to manipulate... because we need to track it down with JS getElementById

SOLUTION
oshgosh's picture

Sweet.

Is there a way I can do something like setting it to a pre saved custom theme style (from the workflow theme editor)?

EX: mybutton.style.display = 'ThemeStyleNameHere'

reecardo's picture

Nah, I don't think so. Themes don't really have an ID anyway, and the syntax has to be valid javascript (setting style.display to a theme name woul not be valid). You basically have to markup all the style items explicitly to match the theme.