EverWeb Widgets

< < < < < <

Random Size Image Slideshow

When displaying images of odd shaped products or artwork, it is sometimes not possible to have all the images with the same aspect ratio. The professional approach would be to insert the images on a background and then crop these to a common aspect ratio. If this is not possible - or within the webmaster's skill level - this slider will do the job.
Slideshow Stage
The slideshow stage is given a suitable aspect ratio which will be the best compromise for the varying sized images. The ratio is calculated by dividing the required width by the height. This allows the slider to be responsive and maintain its aspect ratio.
The aspect ratio in this example is 4:3 which is inserted as 1.33 in the widget settings. Reduce the browser width to see the responsive action.
The slides can be navigated by click (or tap), arrows or swipe and there is also a pager option.
It can be set to autoplay by entering the slide time into the widget settings. Although autoplay excites simple minded visitors, it will not please those who don't want to view all the images if they are using a mobile device with data limits! There is an option to halt autoplay when the visitor interacts with the slider using a mouse click or touch.
If the image quality is good enough, there is an option to play the slideshow in fullscreen. There are two fullscreen modes …
"true" allows the slider to fill the browser window.
"native" opens the the slider to fill the device screen.
Lazy Loading
To overcome the problem of too many large images slowing the page download time. the slider lazy loads the images. This means that, on page load, only the first, second and last images download. The rest download on demand.
The widget has an optional footer with auto update and smooth scroll to the top options so that a fully responsive page can be created.

© EverWeb Widgets -