Skip to content

Instantly share code, notes, and snippets.

@MoOx
Created February 24, 2012 13:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save MoOx/1901062 to your computer and use it in GitHub Desktop.
Save MoOx/1901062 to your computer and use it in GitHub Desktop.
Gravatar without <img> tag
/**
* Gravatar without <img> tag
*
* @memo https://secure.gravatar.com/avatar/36d07341931078d5125fa99397a34ed8?s=140&d=https://a248.e.akamai.net/assets.github.com%2Fimages%2Fgravatars%2Fgravatar-140.png
*
* @todo make this doable with a javascript
* @link http://darcyclarke.me/development/quick-tip-get-gravatar-images-from-emails-with-javascript/
*/
[data-gravatar-uri]::after
{
content: url(attr(data-gravatar-uri)); /* impossible */
}
[data-email-md5]::after
{
content: url("http://www.gravatar.com/avatar/" attr(data-email-md5) "?s=100"); /* more impossible */
}
[data-email-md5][data-gravatar-size]::after
{
content: url("http://www.gravatar.com/avatar/" attr(data-email-md5) "?s=" attr(data-gravatar-size) ); /* more & more impossible */
}
<div data-gravatar-uri="http://www.gravatar.com/avatar/36d07341931078d5125fa99397a34ed8?s=100"></div>
<div data-email-md5="36d07341931078d5125fa99397a34ed8"></div>
<div data-email-md5="36d07341931078d5125fa99397ddddda34ed8" data-gravatar-size="200"></div>
{"view":"split","seethrough":"","prefixfree":"1","page":"html"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment