Hello,
I am looking to emulate the behavior of a field like they have here:
Basically the text "email address" is inside the box and when the user clicks on it, the "email address" text disappears.
I think this can be done with jquery. Any help will be much appreciated.
Richard Vav
Administrator
What your describing is a placeholder and yes you can accomplish that using the following jQuery, 6 is your form number and 102 is the field number, you may need to replace $ with jQuery
$(document).ready(function() {
$('#input_6_102').attr('placeholder','email address');
});I believe there are also a couple of placeholder plugins for gravity forms in the wordpress.org plugin repository that convert the field label into the placeholder. It's worth noting however that the placeholder attribute is not intended to replace the label rather it is intended to act as a guide to filling in the field in addition to the clue provided by the label, also the label is also required by screen readers for visitors with impaired vision.
Richard Vav
Administrator
To style the placeholder text you'll need the following vendor prefix CSS properties
::-webkit-input-placeholder {
color: red;
}
:-moz-placeholder { /* Firefox 18- */
color: red;
}
::-moz-placeholder { /* Firefox 19+ */
color: red;
}
:-ms-input-placeholder {
color: red;
}The ms prefix will only work for IE10 as IE9 and older can't be styled.