Scrollable plugins in action
Here are the available plugins in action:
Provides navigation buttons for switching between pages.standalone demo
By default the plugin searches for an element whose CSS class name is "navi" and auto-generates the navigational buttons inside this element. In our previous setup we have placed the following DIV above the scrollable:
Afterwards the plugin will transform the empty DIV into the following structure:
We have styled the navigator with the scrollable-navigator.css file which looks like this:
You can alternatively generate the navigator links manually as we do in our next demo.
View the documentation of the navigator plugin.
Makes the scrolling automatic. You can play with the action buttons below the scrollable. The autoscrolling will pause if you interact with the scrollable with your mouse.standalone demo
This time we have supplied two configuration options for the plugin. By disabling the autoplay configuration option, the autoscroll won't start when the page loads. Just like all the tools, the plugins also support the api configuration option so that you have an easy access to the tool's programming interface. The API is being used by the action buttons.
The difference between pause and stop is that when the autoscroll is in the paused state the playback will resume if the user interacts with the scrollable with the mouse.
View the documentation of the autoscroll plugin.
Here we use all the plugins together. We have also enabled mousewheel and circular options.standalone demo