jquery-async-gravatar v1.0.1

An asynchronous loading method for Gravatar images.

Platform: Bower

Language: JavaScript

License: MIT

Keywords: jquery, gravatar, gravatars, async, asynchronous, lazy, load, loading, lasyload, lasyloadng

Repository: https://github.com/llaumgui/jquery-async-gravatar.git

Install: bower install jquery-async-gravatar


jQuery async Gravatar

Bower version Build Status branch master Code Climate Test Coverage devDependency Status

An asynchronous loading method for Gravatar images.

Installation

With Bower

Use Bower client:

bower install jquery-async-gravatar

Or, add jquery-async-gravatar to your app's bower.json.

  ...
    "dependencies": {
      "jquery-async-gravatar": "latest"
    },
  ...

Standalone

Include script after the jQuery library (unless you are packaging scripts somehow else):

<script src="/path/to/jquery.async-gravatar.min.js"></script>

Do not include the script directly from GitHub. The file is being served as text/plain and as such being blocked in Internet Explorer on Windows 7 for instance (because of the wrong MIME type). Bottom line: GitHub is not a CDN.

Usage

  • Use a default image instead of Gravatar image and pass the hash as a "data-gravatar_hash" attribute:
<img class="gravatar" alt="Gravatar" src="./test/default.jpg" data-gravatar_hash="THE_USER_GRAVATAR_HASH_HERE" />
  • Select all images and load asynchronous the Gravatars:
$( ".gravatar" ).asyncGravatar( {} );

Options

Option Description Default value
size Image size, which will be dynamically delivered from Gravatar. 64
default_img What happens when an email address has no matching Gravatar image? mm
force_https If you're displaying Gravatars on a page that is being served over SSL and it's not detected. false
rating Gravatar allows users to self-rate their images so that they can indicate if an image is appropriate for a certain audience. g

For more explication see official documentation.

Example

Example with images of "50px", with "identicon" as default image, with rating "pg" and using https:

$(".gravatar").asyncGravatar({
    "size": "50",
    "default_img": "identicon",
    "force_https": true,
    "rating": "pg"
} );

Data attributes

You can also use data attributes on each images:

<img class="gravatar" alt="Gravatar" src="./test/default.jpg"
     data-gravatar_hash="HASH"
     data-gravatar_size="SIZE"
     data-gravatar_default="DEFAULT_IMG"
     data-gravatar_rating="RATING" />

License

Released under the MIT license.

Tagged Releases

v1.0.1 April 04, 2016
v1.0.0 May 25, 2015
v0.1.0 May 19, 2015

Project Statistics

SourceRank 8
Dependent repositories 0
Total tags 3
Latest tag
First tag
Stars 2
Forks 1
Watchers 1
Contributors 2
Repo Size: 25.4 KB

Top Contributors See all

Guillaume Kulakowski Sean Handley

Something wrong with this page? Make a suggestion

Export .ABOUT file for this library

Last synced: 2017-04-17 02:29:17 UTC

Login to resync this project