A lot of options are provided to customise the colour of scrollbars and border radius. Scroll bar width is always the same, so that the scrollbars don't cause breakage of your page. All the basics can be changed and set to match your theme or corporate branding. A couple of advanced options are also provided; like the ability to have the box scroll automatically on mouseover or have ScrollPane stacks fade into view as the page loads. A total of 61 arrow colour variations are available for selection in the stack settings.

ScrollPane was formally developed by Tsooj Media and is currently at version 4. This is a great stack to use for the construction of simple web apps, displaying product variations or for presenting legal content (like terms and conditions). Only vertical scroll bars are supported, and this bodes well with web accessibility guidelines. A lot of people hate scrolling horizontally!

Example

Here are three simple examples of the ScrollPane stacks, with different colour schemes and styling applied.
 
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec condimentum pulvinar molestie. Nullam ut tincidunt mauris, sit amet tincidunt purus. Maecenas suscipit convallis lorem vitae posuere. Curabitur facilisis, lacus sed fringilla porta, ex nibh euismod nisl, at condimentum elit odio at nulla. Aenean id sem laoreet, varius eros sit amet, aliquam ipsum. Maecenas viverra tortor mi, sit amet dignissim sem auctor quis. Phasellus tortor augue, vulputate tincidunt massa et, tempus laoreet leo. Sed viverra volutpat metus. Nulla non ex id urna auctor euismod vel vel augue.

Cras tincidunt ipsum tellus, ut consectetur turpis imperdiet rutrum. Pellentesque laoreet nisi in nisi porta facilisis. Suspendisse sed magna ac enim blandit vulputate. Etiam maximus lorem sit amet nunc molestie, sed consequat elit blandit. Etiam eu tristique orci, vitae rhoncus nibh. Sed iaculis magna ipsum, fermentum eleifend purus hendrerit a. Nunc consequat nunc in tellus pharetra, vitae fringilla nisl lobortis. Nam ultricies enim odio, a varius sem consequat vel. Phasellus egestas gravida accumsan.

Maecenas euismod, est a sollicitudin accumsan, augue enim pharetra eros, in placerat felis urna vitae massa. Maecenas id est erat. Quisque sed ultrices magna. Maecenas lorem neque, imperdiet eu suscipit in, sodales vitae leo. Aenean at varius arcu. In eget lacus luctus, ornare justo quis, luctus enim. Sed odio mi, dictum sed erat non, dictum pretium tellus. Quisque volutpat, lectus sit amet pretium fermentum, eros nisl convallis sapien, et venenatis neque tellus eu tellus. Etiam nec porta nibh. Nullam non ex massa. Maecenas porta ut diam facilisis vestibulum. Fusce diam nisl, tincidunt in erat sed, finibus euismod libero. Vestibulum pulvinar, nisi a sodales tristique, est sapien tincidunt velit, id tristique magna libero vel lorem. Donec tincidunt, eros ac placerat porta, magna erat mattis arcu, et ultricies odio quam vel mauris. Pellentesque odio orci, posuere nec auctor quis, vulputate quis ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Suspendisse sollicitudin pretium massa, ut pellentesque nisl fermentum nec. Proin facilisis, arcu et blandit auctor, lectus velit mattis felis, et tincidunt urna felis eget risus. Etiam luctus, mauris non porttitor auctor, dui est vestibulum ligula, in sagittis ex risus ac risus. Integer ut dui id massa tincidunt ullamcorper scelerisque sed ex. Aliquam aliquam massa sit amet erat dapibus, eu finibus leo tempus. Aenean ac metus nibh. In hac habitasse platea dictumst. Nam eu mauris non augue porttitor molestie vel porttitor augue. Nunc malesuada tincidunt consectetur. Duis faucibus, ex ut egestas suscipit, metus nunc imperdiet mauris, et tempus neque magna a ipsum.

Etiam ornare ornare lacus, sit amet viverra erat accumsan in. Cras euismod, quam et cursus lacinia, eros neque interdum ipsum, ullamcorper accumsan erat lacus at quam. Mauris molestie sed tellus sit amet pretium. Sed egestas justo eget bibendum rhoncus. Quisque sed odio quis dui suscipit convallis. Donec tempus, orci et scelerisque laoreet, velit diam commodo augue, vitae sagittis lorem nunc sit amet ex. In dui lorem, consequat et blandit sit amet, vehicula id eros. Phasellus lobortis odio ante. Morbi interdum egestas erat, vel bibendum lacus volutpat sit amet. Phasellus sit amet interdum odio. Cras vel aliquet elit, non volutpat tortor. Maecenas nec placerat dolor. Ut pretium pellentesque nisl feugiat tempus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec condimentum pulvinar molestie. Nullam ut tincidunt mauris, sit amet tincidunt purus. Maecenas suscipit convallis lorem vitae posuere. Curabitur facilisis, lacus sed fringilla porta, ex nibh euismod nisl, at condimentum elit odio at nulla. Aenean id sem laoreet, varius eros sit amet, aliquam ipsum. Maecenas viverra tortor mi, sit amet dignissim sem auctor quis. Phasellus tortor augue, vulputate tincidunt massa et, tempus laoreet leo. Sed viverra volutpat metus. Nulla non ex id urna auctor euismod vel vel augue.

Cras tincidunt ipsum tellus, ut consectetur turpis imperdiet rutrum. Pellentesque laoreet nisi in nisi porta facilisis. Suspendisse sed magna ac enim blandit vulputate. Etiam maximus lorem sit amet nunc molestie, sed consequat elit blandit. Etiam eu tristique orci, vitae rhoncus nibh. Sed iaculis magna ipsum, fermentum eleifend purus hendrerit a. Nunc consequat nunc in tellus pharetra, vitae fringilla nisl lobortis. Nam ultricies enim odio, a varius sem consequat vel. Phasellus egestas gravida accumsan.

Maecenas euismod, est a sollicitudin accumsan, augue enim pharetra eros, in placerat felis urna vitae massa. Maecenas id est erat. Quisque sed ultrices magna. Maecenas lorem neque, imperdiet eu suscipit in, sodales vitae leo. Aenean at varius arcu. In eget lacus luctus, ornare justo quis, luctus enim. Sed odio mi, dictum sed erat non, dictum pretium tellus. Quisque volutpat, lectus sit amet pretium fermentum, eros nisl convallis sapien, et venenatis neque tellus eu tellus. Etiam nec porta nibh. Nullam non ex massa. Maecenas porta ut diam facilisis vestibulum. Fusce diam nisl, tincidunt in erat sed, finibus euismod libero. Vestibulum pulvinar, nisi a sodales tristique, est sapien tincidunt velit, id tristique magna libero vel lorem. Donec tincidunt, eros ac placerat porta, magna erat mattis arcu, et ultricies odio quam vel mauris. Pellentesque odio orci, posuere nec auctor quis, vulputate quis ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Suspendisse sollicitudin pretium massa, ut pellentesque nisl fermentum nec. Proin facilisis, arcu et blandit auctor, lectus velit mattis felis, et tincidunt urna felis eget risus. Etiam luctus, mauris non porttitor auctor, dui est vestibulum ligula, in sagittis ex risus ac risus. Integer ut dui id massa tincidunt ullamcorper scelerisque sed ex. Aliquam aliquam massa sit amet erat dapibus, eu finibus leo tempus. Aenean ac metus nibh. In hac habitasse platea dictumst. Nam eu mauris non augue porttitor molestie vel porttitor augue. Nunc malesuada tincidunt consectetur. Duis faucibus, ex ut egestas suscipit, metus nunc imperdiet mauris, et tempus neque magna a ipsum.

Etiam ornare ornare lacus, sit amet viverra erat accumsan in. Cras euismod, quam et cursus lacinia, eros neque interdum ipsum, ullamcorper accumsan erat lacus at quam. Mauris molestie sed tellus sit amet pretium. Sed egestas justo eget bibendum rhoncus. Quisque sed odio quis dui suscipit convallis. Donec tempus, orci et scelerisque laoreet, velit diam commodo augue, vitae sagittis lorem nunc sit amet ex. In dui lorem, consequat et blandit sit amet, vehicula id eros. Phasellus lobortis odio ante. Morbi interdum egestas erat, vel bibendum lacus volutpat sit amet. Phasellus sit amet interdum odio. Cras vel aliquet elit, non volutpat tortor. Maecenas nec placerat dolor. Ut pretium pellentesque nisl feugiat tempus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec condimentum pulvinar molestie. Nullam ut tincidunt mauris, sit amet tincidunt purus. Maecenas suscipit convallis lorem vitae posuere. Curabitur facilisis, lacus sed fringilla porta, ex nibh euismod nisl, at condimentum elit odio at nulla. Aenean id sem laoreet, varius eros sit amet, aliquam ipsum. Maecenas viverra tortor mi, sit amet dignissim sem auctor quis. Phasellus tortor augue, vulputate tincidunt massa et, tempus laoreet leo. Sed viverra volutpat metus. Nulla non ex id urna auctor euismod vel vel augue.

Cras tincidunt ipsum tellus, ut consectetur turpis imperdiet rutrum. Pellentesque laoreet nisi in nisi porta facilisis. Suspendisse sed magna ac enim blandit vulputate. Etiam maximus lorem sit amet nunc molestie, sed consequat elit blandit. Etiam eu tristique orci, vitae rhoncus nibh. Sed iaculis magna ipsum, fermentum eleifend purus hendrerit a. Nunc consequat nunc in tellus pharetra, vitae fringilla nisl lobortis. Nam ultricies enim odio, a varius sem consequat vel. Phasellus egestas gravida accumsan.

Maecenas euismod, est a sollicitudin accumsan, augue enim pharetra eros, in placerat felis urna vitae massa. Maecenas id est erat. Quisque sed ultrices magna. Maecenas lorem neque, imperdiet eu suscipit in, sodales vitae leo. Aenean at varius arcu. In eget lacus luctus, ornare justo quis, luctus enim. Sed odio mi, dictum sed erat non, dictum pretium tellus. Quisque volutpat, lectus sit amet pretium fermentum, eros nisl convallis sapien, et venenatis neque tellus eu tellus. Etiam nec porta nibh. Nullam non ex massa. Maecenas porta ut diam facilisis vestibulum. Fusce diam nisl, tincidunt in erat sed, finibus euismod libero. Vestibulum pulvinar, nisi a sodales tristique, est sapien tincidunt velit, id tristique magna libero vel lorem. Donec tincidunt, eros ac placerat porta, magna erat mattis arcu, et ultricies odio quam vel mauris. Pellentesque odio orci, posuere nec auctor quis, vulputate quis ex. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Suspendisse sollicitudin pretium massa, ut pellentesque nisl fermentum nec. Proin facilisis, arcu et blandit auctor, lectus velit mattis felis, et tincidunt urna felis eget risus. Etiam luctus, mauris non porttitor auctor, dui est vestibulum ligula, in sagittis ex risus ac risus. Integer ut dui id massa tincidunt ullamcorper scelerisque sed ex. Aliquam aliquam massa sit amet erat dapibus, eu finibus leo tempus. Aenean ac metus nibh. In hac habitasse platea dictumst. Nam eu mauris non augue porttitor molestie vel porttitor augue. Nunc malesuada tincidunt consectetur. Duis faucibus, ex ut egestas suscipit, metus nunc imperdiet mauris, et tempus neque magna a ipsum.

Etiam ornare ornare lacus, sit amet viverra erat accumsan in. Cras euismod, quam et cursus lacinia, eros neque interdum ipsum, ullamcorper accumsan erat lacus at quam. Mauris molestie sed tellus sit amet pretium. Sed egestas justo eget bibendum rhoncus. Quisque sed odio quis dui suscipit convallis. Donec tempus, orci et scelerisque laoreet, velit diam commodo augue, vitae sagittis lorem nunc sit amet ex. In dui lorem, consequat et blandit sit amet, vehicula id eros. Phasellus lobortis odio ante. Morbi interdum egestas erat, vel bibendum lacus volutpat sit amet. Phasellus sit amet interdum odio. Cras vel aliquet elit, non volutpat tortor. Maecenas nec placerat dolor. Ut pretium pellentesque nisl feugiat tempus.
 

Setup

Follow these instructions for getting a ScrollPane stack working in your webpage:
  1. Once installed in Stacks and RapidWeaver, open your Stacks Library and search for 'scroll pane'
  2. Drag and drop a copy of ScrollPane into your Stacks page
  3. Drag and drop suitable content into the ScrollPane stack, where 'Drop stacks here' is shown
  4. Within the ScrollPane settings, customise the dimensions and colour scheme of your scroll box and scroll bars
  5. Preview you page in RapidWeaver. Export or publish your completed page when done.

As always, hovering your mouse cursor over the settings will display an informational tooltip, explaining what each setting does.

Note ScrollPane is mostly intended for simple content types, like text, images, Markdown and simple HTML code. It is less suitable for use with more complicated stack types.