Skip to content

Commit

Permalink
Updates to Readme
Browse files Browse the repository at this point in the history
  • Loading branch information
jermartin77 committed Oct 27, 2016
1 parent a9a7b81 commit 8035894
Showing 1 changed file with 7 additions and 5 deletions.
12 changes: 7 additions & 5 deletions readme.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,17 @@
#Overflow Scroller

Overflow Scroller is a simple package of CSS and javascript that harnesses the simple <code>overflow: auto</code> behavior allowing for swipeability at mobile and on touch enabled devices (trackpads, magic mouse). On desktop devices it is enhanced to have previous and next arrows that control the scrolling.

### dependencies
## Dependencies
There are a couple dependencies, it will work fine without them but it provides a better experience &amp; performance if they are added.

* __[Modernizr:](https://modernizr.com/download/?-hiddenscroll-setclasses)__Has browser feature detection for Hidden Scrollbars which is true for Mac OS and mobile OS. If 'hiddenscroll' is false (pc browser) the scrollbars will automatically be hidden.
* __[Jquery Throttle Debounce:](http://benalman.com/projects/jquery-throttle-debounce-plugin/)__ This adds the performace benefit of waiting until the scrolling is complete to show/hide the scrollbars.

### Getting Started
## Getting Started
Overflow scroller only requires a simple set of items in a div to get started, the use the css the containing div should have a class name of `overflow-scroller`

#### The Markup
### The Markup
The HTML is pretty simple. A div with a collection of items that are ideally all the same height.
```html
<div class="overflow-scroller">
Expand All @@ -20,7 +22,7 @@ The HTML is pretty simple. A div with a collection of items that are ideally all
</div>
```

#### The Script
### The Script
Overflow scroller is written as a jQuery plugin, there are a few options you can pass to it as well.

* __scrollPercentage:__ A number from 0-1 which dictates how far each click on a previous or next arrow scrolls the container.
Expand All @@ -38,7 +40,7 @@ _Default: 400_
});
```

<h4>The Styles</h4>
### The Styles
Feel free to overwrite the styles to your liking. There is a provided .less file and .css file. We use the less file to build the css file. Before creating a pull request make sure to edit the .less file and then run

`lessc overflow-scroller.less overflow-scroller.css`

0 comments on commit 8035894

Please sign in to comment.