// set the initial type to text
$(".mypasswordfield").attr({
type:'text'
});
// on user focus - change type to password
$(".mypasswordfield").focus(function() {
$(".mypasswordfield").attr({
type:'password'
});
});
// on user blur - change type to back to text
$(".mypasswordfield").blur(function() {
$(".mypasswordfield").attr({
type:'text'
});
});
since text is an attribute we can change it.
all im doing is changing the type between password and text on click and on
blur
let me know if this worked for you :)
On Mon, Oct 19, 2009 at 11:21 AM, Marco Barbosa
<marco.barbos...@gmail.com>wrote:
>
> Hi!
>
> I'm trying to achieve something like the Facebook first page (when
> you're not logged in).
>
> I'm using this simple function/plugin to clean the fields once you
> click them:
> $.fn.cleanField = function() {
> return this.focus(function() {
> if( this.value == this.defaultValue ) {
> this.value = "";
> }
> }).blur(function() {
> if( !this.value.length ) {
> this.value = this.defaultValue;
> }
> });
> };
> // clean the fields
> $("#login").cleanField();
> $("#password").cleanField();
>
> So If I click Login or Password, it will clean and the user can type
> the new value.
> It works good but there's a little usability problem here.
>
> I want to display the Password field like: "Your password here"
> instead of "***********"
> But when the user types his/her password, it has to go back to "****"
>
> So Initially it should be: "Your login" "Your Password"
> And when the user clicks and starts typing it goes: "My login"
> "*******"
>
> It's just the password field that masks the initial value by default.
>
> If you check Facebook they managed to do that somehow.
>
> Any ideas of how can I achieve this?
>
