Animated Vertical Navigation

The navigation can have up to fourteen links. The last two links can be configured as internal or external links to open in a new window if required.
There are options for indicating the current page and a hover animation
Setup
The menu can use a web safe font or a non web safe or Google hosted font with web safe fallback and can be styled for font size, color, background color, hover color and the background color and its opacity.

Options

Current Page
The navigation can show the current page in a different color if required by checking a box and choosing the color.
Container
The container can be styled for padding, background color and opacity, border width color and radius and box shadow color and radius.
Animation
The animation is created by adding a left border and a little horizontal padding on hover. The color and width of the hover indicator can be adjusted in the widget settings.
The change from on load to the hover state is smoothed out by adding a CSS transition. The transition time is adjustable in milliseconds.
If the indicator is not required, set its width to zero. The left to right animation will still occur on hover.
Horizontal Nav
A horizontal version of this widget is available. This can be used in combination with the vertical nav to create two level navigation. The horizontal nav is used for the top level items and the vertical nav for navigating within each directory.
Click the Info button to see the horizontal navigation.