Non-interacting text
If a custom placeholder element is positioned over an input, for instance
with position: absolute, the input cannot be clicked. An almost
cross-browser solution is to make the placeholder "non-interacting":
.noninteracting {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: -moz-none;
-ms-user-select: none;
user-select: none;
pointer-events: none;
}
However, pointer-events: none is not supported in IE. A number of
alternatives have been suggested here, but they seem hacky and may be
overkill for what I want to do.
What is the least hacky cross-browser way to place text above other
elements, but not allow the user to interact with it?
No comments:
Post a Comment