Показать сообщение отдельно
  #22 (permalink)  
Старый 04.09.2012, 00:13
что-то знаю
Отправить личное сообщение для devote Посмотреть профиль Найти все сообщения от devote
 
Регистрация: 24.05.2009
Сообщений: 5,176

немного магии с CSS3 и малость JS:

Только для браузеров поддерживающие CSS3, хотя под IE дописать не проблема
<style type="text/css">
	label {
		position: relative;
	}
	label span {
		position: absolute;
		left: 0;
		width: 100%;

		top: 1px; /* управлять высотой подсказки */

		/* Стиль для placeholder */
		text-align: center;
		color: #aeaeae;
		font-size: 14px;
		font-family: Tahoma;
	}
	label input:focus + span, label input:not([value=""]) + span {
		display: none;
	}
</style>
<!--[if lte IE 8]><style type="text/css">
	/* В ИЕ ниже девятой версии просто не будет отображать подсказку */
	label input + span {
		display: none;
	}
</style><![endif]-->
<label>
	<input type="text" value="" onchange="this.setAttribute('value', this.value);" />
	<span>Please enter name</span>
</label>
<label>
	<input type="text" value="" onchange="this.setAttribute('value', this.value);" />
	<span>Please enter email</span>
</label>
<label>
	<input type="password" value="" onchange="this.setAttribute('value', this.value);" />
	<span>Please enter password</span>
</label>
__________________
хм Russians say завтра but завтра doesn't mean "tomorrow" it just means "not today."
HTML5 history API рассширение для браузеров не поддерживающих pushState, replaceState
QSA CSS3 Selector Engine

Последний раз редактировалось devote, 04.09.2012 в 00:26.
Ответить с цитированием