RWExtras

Scrollable Stack Updated for Stacks 1.3!



This simple to use jQuery-based stack allows you to add impressive features to your page: from a vertical scrolling photo gallery to an auto scrolling news ticker or highly formatted panels with both images and text.

• Just drop the stack on your page and start adding other stacks inside of it: Text Stacks, HTML Stacks, 2-Column Stacks, practically anything...
• Customize the looks to suit your needs
• Add many different Scrollable stacks on the same page
• Scrolling can be set to manual or automatic
• Design your own navigation using text, symbols and special characters, or images
• Interacts well with other jQuery-based stacks*
• Works with Firefox, Safari, Chrome, and IE6 and later
• Here's the user interface and a detailed tutorial
• Only US$7.50

*Although it can be done, we recommend that you use caution to avoid possible conflicts. As usual, we recommend using only one effect per page.

This Scrollable on the right has 6 panels and includes images floated left and right and formatted text.

Previous and Next buttons are images added to the Page Assets. You can use your own images or use text labels and other characters, as shown in the example below.

Notice how we have 3 Stacks plugins interacting on this page: Scrollable, Tooltips, and prettyPhoto, however this can be risky and we suggest using a single effect per page.

Click on the first or second images to invoke a prettyPhoto lightbox!

Hover over the 'Bryce' link in the first panel to get a Tooltip, click on the link and get the National Park Service in an iFrame. Cool!

Navigate using the arrows at the top, your keyboard up/down arrows, or scrolling your mouse wheel...

This Scrollable is placed inside a Thrash Box.

Here we've used arrow characters as navigation labels, therefore they can be set to any color and size, and to a different text color while hovering.

Make sure you click on the link on the last panel...

How about a news ticker? As easy as it comes... This Scrollable was set to show one panel at a time with a 6-sec interval and includes only styled text. The box was created using an external stack to wrap around a Text stack (used for the title) and the Scrollable. Then we applied standard borders and backgrounds to create the box effect.