Как скрыть текст placeholder при клике на текстовое поле?

Гость | 5 марта 2017, 14:14 | 2

Есть форма отправки сообщений, в ней используются плейсхолдеры, например

<input type="text" placeholder="Введите своё имя" />

Мне не нравится, что текст placeholder не исчезает при клике на текстовое поле или при фокусировке на нём. Как лучше всего скрывать этот текст?


CSS

Решения

	input:focus::-webkit-input-placeholder { color:transparent; }
	input:focus:-moz-placeholder { color:transparent; } /* FireFox 4-18 */
	input:focus::-moz-placeholder { color:transparent; } /* FireFox 19+ */
	input:focus:-ms-input-placeholder { color:transparent; } /* Internet Explorer 10+ */

	textarea:focus::-webkit-input-placeholder { color:transparent; }
	textarea:focus:-moz-placeholder { color:transparent; } /* FireFox 4-18 */
	textarea:focus::-moz-placeholder { color:transparent; } /* FireFox 19+ */
	textarea:focus:-ms-input-placeholder { color:transparent; } /* Internet Explorer 10+ */

Ещё как вариант

<input type="text" placeholder="Введите ваше имя" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Введите ваше имя'" />

Ваш e-mail не будет опубликован. Обязательные поля помечены *