Site icon RibosoMatic

Campo para contraseña (input password) similar al iPhone, con Mootools

Al momento de escribir en los campos para contraseñas en el iPhone ó iPod Touch, los caracteres escritos van cambiando a otro con el fin de mantener la privacidad. Este efecto se puede conseguir en nuestras páginas web con la ayuda de distintas librerías JavaScript (como por ejemplo jQuery). En esta ocasión mencionaremos como lograrlo con Mootools.
Se trata de un plugin para Mootools llamado PassShark. Entre sus características encontramos:

Uso básico:

<script type="text/javascript" charset="utf-8" src="Mootools-Core.js"></script>
<script type="text/javascript" charset="utf-8" src="Mootools-More.js"></script>
<script type="text/javascript" charset="utf-8" src="PassShark.js"></script>
<script type="text/javascript">
    window.addEvent('domready', function(){
        new PassShark('sample_pass',{
            interval: 200,
            duration: 2000,
            replacement: '%u25CF',
            debug: false
        });
    });
</script>

Mas información sobre dependencias, opciones y demo de este PassShark en PassShark – iPhone style password masking using MooTools.

Gracias a Luis Merino por su plugin e información.