LiamPerson / Password-Hover-JS

Allow users to see their typed password on hovering a button in the input box. For web.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Password Hover JS

Allow users to see their typed password on hovering a button in the input box. For web.

Password Hover.js <- Right click "Save link as..."


Just add the class ```showPasswordOnHover``` to your password inputs to add functionality. Load in after jQuery.

Load in example:

<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="/js/passwordHover.js"></script>

Example use: <input type="password" class="showPasswordOnHover">


Not Hovering:

Password input field

Hovering:

Hovering on password input field


You can un-comment the marked section in the code if you're using Font-Awesome 4 to use that icon. Also if you want to change the icon just change the const VISION_ICONthough you will also need to change the top: 25.5%;right: 15px; values to get the icon to sit right.

About

Allow users to see their typed password on hovering a button in the input box. For web.

License:MIT License


Languages

Language:JavaScript 100.0%