Stack Vertical Effect &
Digit Template Jquery vertical slider

This slider is bold and eye-catching. It would work well on a light or colored website, thanks to it's dramatic frame and shadow effect.

The slides are contained within a bold black border. The corners of the frame are slightly rounded, which gives it even more weight and emphasis but also helps to prevent the slider from become too stark.

Hovering over the slides brings up navigation arrows. Because they are hidden unless you are directly interacting with the slider, they don't distract from the images on the slides. The navigation arrows themselves are contained in a square with a similar thick border with rounded corners, but it is a dark grey instead of black. The subtle change in color helps to differentiate the navigation from the frame. There is then a lighter grey background in the box, which goes dark when you however over it.

This slider is quite unique, in that instead of having 'dots' to navigate between different slides, it uses small boxes, again using the bold frame effect. Each box contains a number, and hovering over the number makes a preview of the relevant slide appear. The nice thing about this is that it's bold and eye-catching, whereas dots can often be missed. This slider would work well for websites aimed at less-experienced web users, who need a more explicit interface.

The captions appear in the lower left corner, in a dark grey box with rounded corners that emerges directly from the border. This again is quite an unusual placement, with many slider designs making their captions more discreet.

The font used is Arial, a good, bold, san-serif font that many users are familiar with. The use of all-caps makes the captions very clear and easy to read, which is reinforced by a fairly large font-size.

The overall effect is bold, dramatic and eye-catching, but the slider is also incredibly easy to use. Thanks to the use of hover effects, numbers instead of dots, and a large, san-serif font this slider is extremely intuitive and simple.

The slider comes with a number of transition effects (thirteen in total). The default is called 'stack vertical' and this effect again is slightly unusual, in that new slides descend down. Each slide comes in quickly, which again helps to reinforce to users how a slider works, and makes it obvious that there is more content. Hovering over a slide makes it pause, so you can look at it for a longer time if needed.

Because of the bold, stark design ethos, this slider would work well on rugged, masculine websites such as those aimed at bodybuilders and the armed forces. It would also work well on 'no nonsense' websites, such as those that discuss personal finance, or minimalist living. Thanks to intuitive interface, the slider would also be a fantastic choice for websites aimed at older web users.

Fast Preview feature
Want to take a look at a preview of what your existing slider may look like on the web? With the help of the live preview area of your carousel, you can modify and optimize your pattern to develop a unique look.