from Chris Coyier from CSS-Tricks which is pretty useful for WordPress
users and allows the gravatar of a commenter to be dynamically pulled
into the comment box as soon as the user has clicked out of the email
input field.
The Code
This code snippet is pretty easy to grasp. We're simple replacing the
background image of the div #avatar each time the user clicks out of
the email input field. you'll notice that we're also calling the
function MD5(). This is because Gravatar uses your email address
encoded into an MD5 hash as an id to pull your avatar. You also need
to include the function MD5() which is available in the Download.
$(document).ready(function(){
var email = $("#email"),
avatar = $("#avatar");
email.blur(function() {
avatar.css("background-image","url(http://www.gravatar.com/avatar/" +
MD5(email.val()) + ")");
});
});
The HTML
<div id="avatar"><img src="thumb.png" width="80" height="80"/></div>
<form class="gravatar">
<input type="text" onFocus="if(this.value=='Email Address')
this.value='';" onBlur="if(this.value=='') this.value='Email
Address';" value="Email Address" name="s" id="email" />
</form>
