background
ПОСЛЕДНИЕ ПУБЛИКАЦИИ
ПОДПИСКА
Будь В Курсе
Подпишись, и получай эксклюзивные обновления на свой E-Mail:

Ваш E-Mail полностью защищён

ОБСУЖДЕНИЕ

Контактная форма на css3

Прозрачная контактная форма
Просмотров: 2592  Скачан: 246 раз  Комментариев в теме: 2

Прозрачная контактная форма на CSS3 в тёмном стиле. В форме реализована проверка полей, если неправильно к примеру введён email, то выскакивает подсказка. В IE форма не работает.

Шаг 1 - создание разметки

 

HTML

<form>
    <input name="name" placeholder="Как Вас зовут?" class="name" required />
    <input name="emailaddress" placeholder="Ваш Email" class="email" type="email" required />
    <textarea rows="4" cols="50" name="subject" placeholder="Пожалуйста введите текст сообщения" class="message" required></textarea>
    <input name="submit" class="btn" type="submit" value="Готово" />
</form>

Шаг 2 - подключение стилей

 

CSS

<link rel="stylesheet" href="css/style.css" type="text/css" />

Шаг 3 - подключение JavaScript

 

JS

<script type="text/javascript" src="js/modernizr.js"></script>
Материалы по теме:

Форма обратной связи с админкой PHP, JS, CSS, MySQL, AJAXФорма обратной связи с админкой PHP...

Универсальная форма обратной связи написанная на PHP, JS, CSS, MySQL, AJAX. Форма довольно гибкая в возможностях, с помощью админки......

Обратная связь на PHP и JQuery «LightForm»Обратная связь на PHP и JQuery «Lig...

Стильная обратная связь ( LightForm) на PHP, Ajax и JQuery. Форма использует FormCheck2 для проверки полей , NiceForms для стилей текстовых полей и.....

Форма обратной связи на PHP, AJAX, JSФорма обратной связи на PHP, AJAX, ...

Красивая форма обратной связи для вашего сайта на php, ajax и js. Форма может похвастаться капчей, проверкой полей формы на валидность и сообщениях об...

Стильный комплект форм «Zi-4-Forms»Стильный комплект форм «Zi-4-Forms»

Zi-4-Forms - это комплект форм использующий CSS3, комплект состоит с формы входа, регистрации, восстановления пароля, контактная форма....

Обратная связь на JQuery, PHP и MySQLОбратная связь на JQuery, PHP и MyS...

Красивая форма обратной связи на PHP/JQuery и MySQL. В форме реализована проверка полей, сообщение об ошибке и база данных для хранения присылаемых ва...

Фиксированная форма обратной связи «Contactable 1.5»Фиксированная форма обратной связи ...

Стильная форма обратной связи, а если быть точнее то это jquery плагин Contactable v1.5, который работает на AJAX и имеет встроенную проверку полей на...

Контактная форма (дизайн)Контактная форма (дизайн)

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

Форма обратной связи на PHP, AJAX, JSФорма обратной связи на PHP, AJAX, JS

Красивая форма обратной связи для вашего сайта на php, ajax и js. Форма может похвастаться капчей, проверкой полей формы на валидность и сообщениях об...

Cлайдер КарусельCлайдер Карусель

Слайдер картинок, с бесконечной прокруткой, в слайдере имеется красивый эффект......

AirlinesAirlines

Красивый шаблон Airlines на HTML5, хорошо подойдёт для корпоративного сайта....

ClockerClocker

Универсальный html шаблон Clocker, на главной странице располагается слайдер, есть портфолио, выпадающее меню, заготовка контактной формы......

Горизонтальное меню на jQuery «Menu Kwicks»Горизонтальное меню на jQuery «Menu Kwic...

Стильное горизонтальное меню с выдвижными иконками

Чекбокс на css3Чекбокс на css3

Чекбокс имитирующий реалистично кнопку включения, идея в принципе неплохая, но......
  • Текущий 1.78/5
  • 1
  • 2
  • 3
  • 4
  • 5

Рейтинг: 1.8/5( Голосов 9 )

Комментариев в теме: (2)
↑ 0 ↓
zyzz
хотел бы узнать,а как сделать что бы надписи об ошибках были на английском а не на русском.Весь код просмотрел так и не нашёл где вместо русских символов английские написать.
Ответить Ответ с цитатой
↑ 0 ↓
ADMIN
Здравствуйте, как видите в полях формы прописан атрибут required, он устанавливает поле формы обязательным для заполнения перед отправкой формы на сервер. Если обязательное поле пустое, браузер выведет сообщение, а форма отправлена не будет. Вид и содержание сообщения зависит от браузера и меняться пользователем не может. http://htmlbook.ru/html/input/required

Ответить Ответ с цитатой

Страницы: 1

Авторизация:
YandexGoogleVKMail.ruTwitterFacebookOdnoklassniki


Ваше имя:
Сайт:
Ваша почта:
RSS
Комментарий:
Введите символы:
captcha
Обновить