EverWeb Widgetbox

Mountain Lake
overflow acrossel
Trinidad bay
San Francisco
Alt text for seo
Trinity Alps
Custom background box shadow
Beached Angel
Adjustable image width
Reading California
On load slide number
Safe Landing
Slide density
Whiskeytown Lake
Image Offset
Image Scale
California Sunset
Background opacity
Whiskeytown Winter

Coverflow Carousel

Coverflow Carousel
Coverflow Carousel
Coverflow Carousel


This project is definitely NOT for those who expect instant gratification since what you see in EverWeb is not what you get in the browser!

The widget creates a coverflow style carousel with alt text for SEO and captions on a transparent background which can be position at the top left or right.

The slides are navigated by clicking, mouse wheel scroll or swipe on mobile devices.

The carousel background color can be set and it can have a box shadow if required.

The image to show on page load can be selected and the slides adjusted for density, offset and scale.  These values depend on the individual slide width, the carousel width and the number of slides.

Due to the vagaries of EverWeb, the effect of any of these adjustments will have to be viewed in the browser via the Preview button.

When setting the slide to show on page load, remember that the first slide number is zero.

Widget Settings

The images are loaded in the usual way be either selecting them one by one from the EverWeb Assets List are dragging them en masse from a Finder folder onto the Assets List in the widget seetings panel.

Find out more about preparing the images and loading them.

Highlight each image file name in turn and enter alt text for SEO and a caption if required. If there are to be no captions, set the caption background opacity to zero.

Adjust the width and height of the carousel using the drag handles or the Metrics inspector.

Enter the required individual image width and set the number of the slide which will apear on page load.

Adjust the slide density, offset and scale to suit. Preview in the browser to see the effect of these changes.

Set the caption font family, size and color.

Enter the RGB color numbers for the caption background and set the opacity.

Choose the caption position.

Set the carousel background color and box shadow if required.

Get The Widget