The plugins site is currently in development.
We've been looking to provide a higher-quality, spam-free experience at the plugins site for some time, and a major error on our part forced us to shut down the current site before we could put the new one in place. We are developing a new site, and you can follow along with its development on GitHub. For more information about this transition, including steps you can take as a plugin author to prepare, please read our post about what's going on.
(mb)scrollable, scroll your content!
Need to show many elements in constricted space?
1, 2, 3, 15...slide how many box you want with a simple and configurable navigation toolbar.
here is the js call:
$("#myScroll").mbScrollable({
width:700,
elementsInPage:1,
elementMargin:2,
shadow:"#999 2px 2px 2px",
height:"auto",
controls:"#controls",
slideTimer:600,
autoscroll:true,
scrollTimer:4000
}); here is the code for the dom elements:
<div id="myScroll">
<div class="scrollEl" style="background-color:#9999ff">1</div>
<div class="scrollEl" style="background-color:#cc9900">2</div>
<div class="scrollEl" style="background-color:#660066">3</div>
</div>
<div id="controls">
<div class="first">first</div><div class="prev">prev</div>
<div class="next">next</div><div class="last">last</div>
<div class="pageIndex"></div>
<div class="start">start</div><div class="stop">stop</div>
</div>
parameters:
width:700
(int) the width of the visible area
dir: “orizontal”
(string) or “vertical”; set the scroll direction of the component.
elementsInPage:3
(int) how many elements should be visible on each slide
elementMargin:2
(int) the space between each element
shadow:"#999 2px 2px 2px"
(string or "false") the css style for the shadow of each element (doesn't work in IE)
height:"auto"
(int or "auto") the height of each element in the scroller
controls:"#controls"
(string) the ID of the controls element
slideTimer:600
(int) the time in milliseconds for the transition effect
autoscroll:true
(boolean) if it has to start scrolling once initialized or not
scrollTimer:4000
(int) the time in milliseconds each screen should stop
Once you give the width of the visible area, the plugin define the with for the single element according with the elementsInPage and the elementMargin parameter;
if the autoscroll parameter is set to true the scrollable stops scrolling once you rollover each element and starts again once you rollout;
The controll tool can be configured as you whant; the complete controller is composed by:
first | prev | pageIndex |next | last | start | stop.
