ractive-component-baron
Ractive component wrapping Baron.js scroller library.
Usage:
npm install ractive-component-baron
- In your app do
require('ractive-component-baron');
This will add theScroll
object toRactive.components
. - In your Ractive template:All attributes are optional. Use... scrollable content
disable='true'
when native scroll is preferable.dir
may be one of'x'
for horizontal scroll,'y'
for vertical scroll (default) or'xy'
for bidirectional scroll.opts
allows to extend default Baron options, which are:defaultOpts =scroller: '.scroller'bar: '.scroller__bar_v'barOnCls: 'baron'$: {return ;}{mode == 'trigger' && mode = 'fire';beanmode || 'on'elem event func;} - Include
baron.css
from the repository tweaked to your needs. - Fix height and/or width of
.myscroll
using some CSS.
See example/
directory for working example. Run npm install
in both root and example directories, then node server.js
and go to localhost:3333
in your browser.
Note that Baron uses MutationObserver to update scroller when necessary.
License
MIT