DataLife Engine > Версия для печати > PassEye или "Парольный глаз"

Обычно, в полях с паролями, всё прячется под звёздочками или точками. С позиции безопасности, это конечно правильно. Но ведь 99.9% процентов времени, мне не приходится прятать свой пароль от любопытных личностей и это скорее создаёт неудобства, т.к. я не вижу что ввожу. Проблемы с раскладкой, опечатки…с этим сталкивался наверное каждый. Поэтому мы немного позаботимся о пользователе добавив Парольный глаз, который показывает или скрывает вводимый пароль.

Установка:

1. Копируем из архива файл jquery.passEye.js в папку /JS/ вашего шаблона, а файл passEye.png в папку /images/.2. Перед закрывающим тегом:

Вставляем:

3. В файле стилей CSS шаблона добавляем:

/* PassEye */
.passEye {position:relative;display:inline-block;}
.passEye input {padding-right:35px;}
.passEye input::-ms-reveal, .passEye input::-ms-clear {display:none}
.passEye .eye {position:absolute;right:10px;top:50%;margin-top:-4px;display:block;height:10px;width:18px;background:url(../images/passEye.png) no-repeat left 2px;cursor:pointer;}
.passEye .openEye {background-position:left bottom;}

4. Оборачиваем нужный нам input в span:

 тут ваш input 

5. Готово!

Вам может потребоваться небольшая настройка CSS стилей, т.к. при добавлении «глаза», немного меняется размер поля. Так-же не забывайте указать путь к картинке, если она находится не рядом с CSS стилями.