14:43 | 05.05.2024
Web-разработка
Реклама

jQuery табы

Интересные стильные решения для оформления форм обратной связи на сайте с использованием CSS и jQuery.

В заметке представлено 20 различных реализаций: пошаговые формы, формы с проверкой правильности ввода информации «на лету», всплывающие подсказки при заполнении форм, формы с CSS3 анимированными эффектами, формы, выезжающие с различных сторон, форма в стиле Facebook, форма в стиле старой печатной машинки и другие решения. Я думаю, вы обязательно подберете подходящий вариант.

1. Плагин для создания онлайн форм «jFormer»

Форма

Создание контактных форм: обратной связи, комментирования, форма входа, форма регистрации с проверкой правильности ввода информации.

2. Пошаговая форма регистрации с использованием jQuery

jQuery форма регистрации

Аккуратная форма с пошаговым заполнением. Снизу указан индикатор заполнения формы.

3. Пошаговая форма

jQuery табы

Заполнение формы в несколько шагов с проверкой правильности заполнения.

4. Контактная форма для сайта

Форма отправки данных на сайте

Проверка правильности ввода ифнормации осуществляется «на лету» перед отправкой сообщения с использованием JavaScript.

5. Анимированное переключение между формами на jQuery

jQuery форма

Анимированное переключение с помощью jQuery между формой входа на сайт, формой регистрации и полем для восстановления пароля. На демонстрационной странице нажмите на желтую ссылку для того чтобы увидеть эффект.

6. Выезжающая PHP форма обратной связи

Форма обратной связи

Подобное решение можно использовать для того, чтобы дать посетителю возможность быстро связаться с владельцем сайта с любой страницы. На демонстрационной странице нажмите на стрелочку снизу, чтобы выехала форма.

7. PHP форма регистрации с использованием jQuery и CSS3

Форма входа

Форма с проверкой правильности ввода информации.

8. PHP форма регистрации в стиле Facebook

Форма регистрации в стиле Facebook

Симпатичная форма регистрации, реализованная с помощью CSS, PHP и jQuery.

9. jQuery контактная форма «SheepIt»

jQuery форма

Реализована возможность перед отправкой сообщения добавлять новые поля.


1

2