On 2013-03-20 10:18, Markus Ernst wrote:
The problem is that some users do not even start to type when they see
text in the field they focused. Thus I strongly believe that some
visible hint at the _focusing_ moment would be helpful for these
users. If the Opera and IE behaviour of totally hiding the placeholder
is considered as suboptimal, the placeholder could be blurred, made
semi-transparent or whatever; but I am sure that something should
happen when the control gets focus, and not only when the user starts
typing.
Have it dim/vanish at not just onfocus but onmouseover as well? (and
TAB, but that should be the same as onfocus usually)
I agree that this would be beneficial.
Here is an example: (go to http://htmledit.squarefree.com/ or someplace
similar or save it locally as .html and test it that way)
<style type="text/css">
/****** css start *****/
input::-webkit-input-placeholder
{ /* WebKit browsers */
color: red;
}
input:hover::-webkit-input-placeholder
{ /* WebKit browsers */
opacity:0.5;
text-align:right;
}
input:focus::-webkit-input-placeholder
{ /* WebKit browsers */
opacity:0.0;
}
input:placeholder
{ /* future standard!? */
color: red;
}
input:placeholder:hover
{ /* future standard!? */
opacity:0.5;
text-align:right;
}
input:focus:placeholder
{ /* future standard!? */
opacity:0.0;
}
/****** css end *****/
</style>
<!- ***** html start ***** ->
<input name="first_name" id="first_name" placeholder="Your first
name..." type="text">
<!- ***** html end ***** ->
I only did webkit! (and what I assume will be the standard?)
Reason I did not add any css for IE 10 or Firefox 19 is that they fail
(at least I could not easily get this to work in those browsers), Chrome
25 handles this just fine.
Other than me playing around a little with the right align to visually
move the placeholder text "out of the way", I assume this is how you
would like it to look/behave Markus?
So maybe a placeholder opacity of 0.5 on hover, and opacity of 0.0 on
focus would be a suitable browser default. (web authors should still be
able to style the behavior like I just did)
--
Roger "Rescator" Hågensen.
Freelancer - http://www.EmSai.net/
