README.md
1##Responsive Elements
2Responsive elements makes it possible for any element to adapt and respond to the area they occupy. It's a tiny javascript library that you can drop into your projects today.
3
4Feedback, bugs, questions? [email](mailto:contact@kumailht.com) me, I'll respond quickly, promise!
5
6###Example
7- [Responsive Elements Homepage](http://kumailht.com/responsive-elements/)
8
9###Usage
10
11####1. Load jQuery and `responsive-elements.js` right before your closing `</head>` tag
12
13```html
14<script src="jquery.min.js"></script>
15<script src="responsive-elements.js"></script>
16```
17
18####2. Explicitly declare which elements you want to be responsive using a data-respond attribute
19
20```html
21<div class="quote" data-respond>
22```
23
24####3. Use 'less than' and 'greater than' classes as breakpoints to write responsive CSS
25```css
26.quote.lt500 {background: blue}
27.quote.gt150.lt300 {background: red}
28```
29
30####4. Optionally declare start, end and interval values on your `data-respond` attribute to control breakpoint generation
31```html
32<div class="quote" data-respond="start: 100px; end: 900px; interval: 50px;">
33```
34- Start: What pixel value should breakpoint generation start at
35- End: What pixel value should breakpoints end at
36- Interval: How many pixels between breakpoints
37