A carousel of horizontal list items that automatically slides the appropriate number of items across the screen based on screen width.
The styles are compiled to CSS, but the base code was written using SASS. This allows for variables, mixins, modularized CSS, and more. You can learn more about SASS at http://sass-lang.com/.
- Transit - Used for hardware accelerated animations that mimic the jquery animation api for callbacks
- Jquery - Cross browser compatibility
- JqueryUI - Used for the widget factory
- Throttle/Debounce - Used to debounce window resize events. So only one event will fire at the end of a resize regardless of the browser.
- styles - Sass and CSS files
- example-skin - the skin to show the example on the index page
- list-slide - code to make the list-slide work
- scripts
- plugins - contains the listslide plugin
- vendor - contains any scripts the plugin relies on application-bootstrap - what is use to define the animation style for transit, and initiate the example list-slide
- index.html - an example page showing the list-slide in action.
- Ensure you have Sass by opening terminal and typing: sass -v
- Navigate to the base folder of this repo listslide
- Run: sass --watch styles:styles
listslide.js
- redo "getIttr" function for actual calcs
- remove options.liwidth
- add nav buttons?
- Based on assumption that ULs and LIs won't change in size after initialization
- Bassed on assumption UL and LIs have the same font-size.
The MIT License (MIT)