How can I change the "roll-over" color of a button in a form? | Community
Skip to main content
A
Anonymous
October 8, 2015
Question

How can I change the "roll-over" color of a button in a form?

  • October 8, 2015
  • 2 replies
  • 1637 views

Hello all,

I know how to change the first color of a button, but not the "roll-over" color (when the cursor is over the button).

The button I chose is the following one, and I would like the second color to be grey instead of purple:

Any help?

Thanks a lot,

Margaux

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

2 replies

Grégoire_Miche2
Grégoire_Miche2
Level 10
October 8, 2015

Hi Margaux,

This will take some CSS.

Edit the form, go to the form them section, clixk the wheel on the right and select "Edit custom CSS".

you will need a CSS entry such as

    .mktoForm .mktoButtonWrap .mktoButton:hover {

  background-color: #c2c2C2 !important;

    }

Bien cordialement,

Grégoire

A
Anonymous
October 8, 2015

Try this:

<a href="#"><img src="button1.png" onmouseover="this.src='button2.png'" onmouseout="this.src='button1.png'" /></a>

Grégoire_Miche2
Grégoire_Miche2
Level 10
October 8, 2015

Hi Lea,

YOur approach would work for a CTA in an email, but not for a form submit button. You canot change the HTML code of a Marketo form button.

-Greg

SanfordWhiteman
SanfordWhiteman
Level 10
October 14, 2015

Well, I wouldn't say you cannot, but you should not.  It's better to work on restyling the form than actually changing the form DOM.  Though I've been known to do the latter if necesssary.  

Anyway, changing out the INPUT[type=submit] for an A would never be advisable.  A BUTTON is more semantically accurate, reacts more interactively ("button pressed" state), and is just as functional.

Terms & ConditionsAccessibility statement

Loading footer...