Подписи для полей форм

Это простой jQuery плагин позволяющий выводить подписи к полям ввода форм. В сжатом виде плагин занимает менее 1Kb.

Источник

fuelyourcoding.com/scripts/infield/

Скачать

Примеры

Подписи для полей ввода форм

Описание

Плагин накладывает содержимое элемента <label> поверх соответствующих полей ввода. При установке фокуса в поле ввода подпись для этого поля становится полупрозрачной. Подпись исчезает, если пользователь начинает вводить текст. Если фокус уход с поля и его значение не было изменено, подпись появляется на прежнем месте.

Установка

Подключите библиотеку jQuey и плагин

1
2

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../src/jquery.infieldlabel.min.js" type="text/javascript" charset="utf-8"></script>

Для работы плагина необходима следующая HTML структура

<p>
   <label for="field_id">Label Text</label><br />
   <input type="text" name="field_id" value="" id="field_id">
</p>

CSS стили, необходимые чтобы поместить подпись поверх поля ввода

1 2	form p { position:relative } label { position:absolute; top:0; left:0}

Инициализация плагина

1
2
3

$(document).ready(function(){
   $("label").inFieldLabels();
});

Настройка

Для настройки плагина есть два параметра, которые регулируют скорость анимации и прозрачность подписи. Эти значения можно изменить для всех полей, используя следующий синтаксис:

1	$.inFieldLabels.defaultOptions.optionName = "";

или только для отдельных полей

1	$("label").inFieldLabels({ optionName:value });

Параметры:

параметр

значение по умолчанию

описание
fadeOpacity

0.5

Степень прозрачности подписи при фокусе на поле ввода. Возможны значения от 0 до 1
fadeDuration

300

скорость изменения прозрачности

Категории: формы

jquery обзор плагинов