Ermintrude - Examples

Here you'll find a selection of demos for the Ermintrude carousel widget. Click a link to jump to that demo.

• Basic
• Navigation
• Focus
• Other Elements
• Shapes
• Further Link

---

Basic

This is the default carousel created. Click an item to bring it to the front.

Default carousel.

Back To Top

---

Navigation

You can also set the carousel up to be controlled by buttons.

Using navigation buttons.

Back To Top

---

Focus

The currently focused element is given it's own class so it is possible to highlight it.

Current element highlighted.

Back To Top

---

Other Elements

The default structure is an Unordered List (ul) but you can use other DOM elements such as divs.

Using a div layout.

Using images.

Back To Top

---

Shapes

There are a number of additional shapes in addition to the default 'lazySusan'. As with the rest of the library these are ports of Fred LeBlanc's original shapes. Click one of the links below to jump to that shape.

• Water Wheel
• Figure 8
• Square
• Conveyor Belt Left
• Conveyor Belt Right
• Diagonal Ring Left
• Diagonal Ring Right
• Rollercoaster
• Teardrop
• The Juggler
• Goodbye Cruel World

Water Wheel (waterWheel)

Figure 8 (figure8)

Square (square)

Conveyor Belt Left (conveyorBeltLeft)

Conveyor Belt Right (conveyorBeltRight)

Diagonal Ring Left (diagonalRingLeft)

Diagonal Ring Right (diagonalRingRight)

Rollercoaster (rollerCoaster)

Teardrop (tearDrop)

The Juggler (theJuggler)

Goodby Cruel World (goodbyeCruelWorld)

Back To Top

---

Further Links

Check out the project page or view the source and usage instructions on GitHub .