From 07551c7c275b352215aa899585b289e0eeb052fb Mon Sep 17 00:00:00 2001 From: Amit Chaudhary Date: Mon, 20 Mar 2017 14:46:59 +0545 Subject: [PATCH 1/2] Rename readme.md to README.md --- readme.md => README.md | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename readme.md => README.md (100%) diff --git a/readme.md b/README.md similarity index 100% rename from readme.md rename to README.md From 6e6a147b6e5c3ed06b4d428370396bb257268472 Mon Sep 17 00:00:00 2001 From: Amit Chaudhary Date: Mon, 20 Mar 2017 14:48:05 +0545 Subject: [PATCH 2/2] Fix markdown syntax --- README.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 4cb4d91..eea3c04 100644 --- a/README.md +++ b/README.md @@ -1,19 +1,19 @@ -#Rotating Heads +# Rotating Heads This plugin was written for use in the [Anthropose](http://anthropose.com/product/aristle/) website in order to show how sunglasses would look like. This is actually a very low tech solution to a virtual try-on implemented in the Rayban website and is heavily inspired from the [Warby Parker](https://www.warbyparker.com/) website. -##General Idea +## General Idea 1. The general idea in this plugin is to use a [sprite image](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/CSS_Image_Sprites) so that all angles are loaded simultaneously. 2. If the number of images are 5 then the container is also divided into 5 parts. 3. Hover on each part of the container will change the background position of the sprite to match accordingly. -##Options -###Options include: +## Options +### Options include: 1. total_banner_width in pixels *(width of entire sprite )* 2. total_width in pixels *(width of each individual item image in sprite)* 3. Number of images is the number of seperate blocks within the sprite image. -##Usage +## Usage 1. Using defaults > $("#rotate-container").rotateHeads();