Skip to content

Instantly share code, notes, and snippets.

@tylersticka
Created July 19, 2013 22:03
Show Gist options
  • Save tylersticka/6042662 to your computer and use it in GitHub Desktop.
Save tylersticka/6042662 to your computer and use it in GitHub Desktop.
A class I sometimes use in my SASS/SCSS projects to add native-style scrolling to a fixed container in mobile or hybrid-mobile web apps.
// Native scrolling (iOS 5+, Android 4+)
.scrollable {
overflow: auto; // Fallback for non-touch browsers
-webkit-overflow-scrolling: touch; // Native-esque scrolling on touch-enabled webkit
// Everything below here improves performance of scrolling. You can omit this at
// first and add as your content becomes more complex and performance needs a boost.
&, > * {
-webkit-backface-visibility: hidden;
}
> * {
position: relative;
@include translate3d(0,0,0);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment