EverWeb Widgets

animate in slider

Responsive Slider

animate in slideshow

Swipe On Touch Devices

EverWeb widget

Lazy Loading Images

EverWeb widgets animated slideshow

Optional Captions & Links

Lazy Loading Slideshow

Responsive Slider

A slideshow for a responsive page sould have a maximum width equal to the width of the image file. Images should be cropped to no more than 1200px wide before importing into EverWeb. Less is better!
Lazy Loading
Lazy loading images are more or less essential for a responsive slider if it has more than 3 or 4 images. Otherwise, mobile visitors will have to download all the image files even if they don't want to view them.
The lazy loading feature in this slideshow downloads the first, previous and next images at page load. The rest are downloaded as required.
Navigation
The slides can be navigated using the directional arrows or by grab and drag on computers. On touch devices, the directional arrows can be hidden if required and the slides swiped.
The transition time is set in milliseconds and the transition type can be slide or fade.
Captions
Captions can be turned on globally and are overlayed and centered at the bottom of the image. They can use a web safe font or a non websafe or Google hosted font with a web safe fallback. The caption background color has an opacity slider.
Links
The slides can be configured as hyperlinks to open internal or external pages and in a new window if required.
Animation
The animation fires every time the slider is scrolled into the viewport. There is a checkbox to cause it to only fire once on page load and another to implement the aniimation on mobile phones.
There is a checkbox for turning on the animation and controls for setting the animation time and delay in seconds and for choosing the animation direction.
NOTE:  When several of these widgets are inserted on the same page, the settings for "Animate only once" and "Animate on mobile phones" must be the same for each one.

© EverWeb Widgets -