Приветствуем Вас на сайте!
      Авторизировавшись на сайте Вы получаете возможность заказывать эксклюзивные вещи для Вашего сайта, скачивать новинки, общаться с друзьями.

      Если у Вас ещё нет аккаунта на BEST STUDIO, вы можете создать его потратив не более 10-ти секунд используя форму справа с заголовком "Вход на сайт"
Вход на сайт
Логин:

Пароль:
Вход
Войти по Логину и Паролю
О нас
Cтудия скриптов и дизайна BEST STUDIO, как студия перспективных веб-разработок, была основана 1 июля 2009 г. Уже более 17000 зарегистрированых пользователей! С момента ее создания мы четко придерживаемся принципа: «Быстро, качествено, дорого».

Заказывая работу для вашего сайта у нас, вы экономите время...

Стремитесь к лучшему - в Best Studio!
Войти | Зарегистрироваться
Настройки
Анимация Шапки
Анимация Меню
Анимация Футера
Автообновление Чата
Автообновление Статистики
Звуковые Оповещения
Авто Подгрузка Материалов

Перезагрузите страницу
Выпадающие подсказки с E-mai Адресами.
DEMO +
Скрипт упрощает ввод E-mai Адреса путем выпадения подсказок нужных зон!... Скрипт легкий и прост в установке.

Установка:
Добавляем js скрипт:
Код
$(function () {
  $('#test').append('<div id="all-mail"></div>');
function mMail() {
var mMail = $('input').val();
if(mMail.length > 3 | mMail.indexOf('@') != -1) {
$('#all-mail').html('<div class="myMail"><i>'+mMail+'</i>@bk.ru</div><div class="myMail"><i>'+mMail+'</i>@ro.ru</div><div class="myMail"><i>'+mMail+'</i>@ya.ru</div><div class="myMail"><i>'+mMail+'</i>@me.com</div><div class="myMail"><i>'+mMail+'</i>@gmx.com</div><div class="myMail"><i>'+mMail+'</i>@list.ru</div><div class="myMail"><i>'+mMail+'</i>@mail.ru</div><div class="myMail"><i>'+mMail+'</i>@gmail.com</div><div class="myMail"><i>'+mMail+'</i>@inbox.ru</div><div class="myMail"><i>'+mMail+'</i>@lenta.ru</div><div class="myMail"><i>'+mMail+'</i>@yandex.ru</div><div class="myMail"><i>'+mMail+'</i>@yahoo.ru</div><div class="myMail"><i>'+mMail+'</i>@hotmail.ru</div><div class="myMail"><i>'+mMail+'</i>@outlook.ru</div>').show();
} else {$('#all-mail').hide();}
myMail();
if(mMail.indexOf('@') != -1 || mMail.indexOf('.') != -1 || mMail.indexOf(' ') != -1) {$('#all-mail').hide();}
};

function myMail() {
$('.myMail').click(function () {
var mThismail = $(this).html();
mThismail = mThismail.replace('<i>','').replace('</i>','');
$('#all-mail').hide();
$('input').val(mThismail);
});  
$(document).click(function () {$('#all-mail').hide();});  
};
$('input').keyup(function () {
mMail();
});
});


#test - Меняем переменную на ту которая находится ваш input поля ввода.

2. Добавим CSS стили:
Код
div#all-mail {display:none;
  position: absolute;
  padding: 5px;
  background: #344149;
  color: #fff;
  margin: 10px 0px 0px 10px;
  border: 1px solid #000;
  border-radius: 2px;
}
div#all-mail:after, div#all-mail:before {
  bottom: 100%;
  left: 20px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

div#all-mail:after {
  border-color: rgba(52, 65, 73, 0);
  border-bottom-color: #344149;
  border-width: 8px;
  margin-left: -8px;
}
div#all-mail:before {
  border-color: rgba(0, 0, 0, 0);
  border-bottom-color: #000;
  border-width: 9px;
  margin-left: -9px;
}
.myMail {
  cursor: pointer;
  padding: 2px 10px 5px 0px;
  margin-top: 5px;
  font-size: 12px;
  font-family: sans-serif;
}
.myMail:hover {
  background: rgba(0, 0, 0, 0.38);
}
.myMail i {
  font-style: normal;
  background: #1c90f3;
  color: white;
  padding: 2px 5px 5px 5px;
  margin-right: 3px;
}
.myMail:hover i {background: forestgreen;}
Данный раздел авторский все работы являются собственностью BS (mybeststudio.ru) любое коммерческое использование строго запрещено.

При копировании материала указываем источник MyBeststudio.ru.

Для редактирования кода необходимо иметь хотя бы базовые знания в HTML, CSS и Js технологиях.
Поделиться новостью в социальной сети.
Добавил: Best_Studio
Дата добавления: 18.07.2016 в 12:08 по МСК
Категория: Другие модули
Просмотров: 242
Комментариев: 0
Эмоций:
Теги: mail, best, js, css
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]