Skip to content

Commit

Permalink
Updates to the size of the arrows and fixing typo in readme.
Browse files Browse the repository at this point in the history
  • Loading branch information
jermartin77 committed Oct 31, 2016
1 parent 484b8e4 commit aa46b99
Show file tree
Hide file tree
Showing 4 changed files with 9 additions and 9 deletions.
2 changes: 1 addition & 1 deletion index.html
Original file line number Diff line number Diff line change
Expand Up @@ -236,7 +236,7 @@ <h3>dependencies</h3>
<p>You can download Overflow Scroller <a href="https://github.com/zaneray/overflow-scroller">here</a>. There are a couple dependencies, it will work fine without them but it provides a better experience &amp; performance if they are added.</p>
<ul>
<li><strong><a href="https://modernizr.com/download/?-hiddenscroll-setclasses" target="_blank">Modernizr:</a></strong> 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.</li>
<li><strong><a href="http://benalman.com/projects/jquery-throttle-debounce-plugin/" target="_blank">Jquery Throttle Debounce:</a></strong> This adds the performace benefit of waiting until the scrolling is complete to show/hide the scrollbars. </li>
<li><strong><a href="http://benalman.com/projects/jquery-throttle-debounce-plugin/" target="_blank">Jquery Throttle Debounce:</a></strong> This adds the performace benefit of waiting until the scrolling is complete to show/hide the previous/next arrows. </li>
</ul>
<h3>Getting started</h3>
<p>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 <code>overflow-scroller</code></p>
Expand Down
12 changes: 6 additions & 6 deletions overflow-scroller.css
Original file line number Diff line number Diff line change
Expand Up @@ -49,16 +49,16 @@
@media (min-width: 600px) {
.overflow-scroller-arrow {
left: 15px;
width: 50px;
height: 50px;
width: 46px;
height: 46px;
}
}
.overflow-scroller-arrow:hover {
background-color: rgba(0, 0, 0, 0.9);
}
.overflow-scroller-arrow.overflow-scroller-arrow-hide {
opacity: 0;
transform: translate(-65px, -50%);
transform: translate(-61px, -50%);
}
.overflow-scroller-arrow-next {
right: 15px;
Expand All @@ -67,7 +67,7 @@
}
.overflow-scroller-arrow-next.overflow-scroller-arrow-hide {
opacity: 0;
transform: rotate(180deg) translate(-65px, 50%);
transform: rotate(180deg) translate(-61px, 50%);
}
.overflow-scroller-arrow:before {
content: '';
Expand All @@ -83,7 +83,7 @@
}
@media (min-width: 600px) {
.overflow-scroller-arrow:before {
width: 15px;
height: 15px;
width: 13.8px;
height: 13.8px;
}
}
2 changes: 1 addition & 1 deletion overflow-scroller.less
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@

//variables customize as needed
@arrow-size-small: 32px;
@arrow-size: 50px;
@arrow-size: 46px;
@screen-sm: 600px;
@gutter-width: 10px; //should be the same as margin or padding on each element

Expand Down
2 changes: 1 addition & 1 deletion readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ Overflow Scroller is a simple package of CSS and javascript that harnesses the s
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.
* __[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 the previous/next arrows.

## 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`
Expand Down

0 comments on commit aa46b99

Please sign in to comment.