Fotorama Thumbnail Carousel Slider

Using separate thumbnail images allows the web page to download faster since the full size images aren't required to download on page load.
The thumbnail carousel can be placed at the top or bottom of the slideshow and the size of the thumbnail images is set in the widget settings.
The thumbnails have alt text for SEO and the large images can have a caption if required.
Navigation options are for arrows, click and swipe in addition to clicking on the thumbnail images. Transition types are slide, crossfade and dissolve and the transition time is adjustable.
As can be seen from this example, there is a full size option which allows the slider to fill the browser width when set to "true" and to fill the screen when set to "native".
Turning on the "shuffle" option will display a different slide order every time the page is reloaded.
The slideshow is contained in an HTML5 section element with an optional h1 heading and paragraph to describe the content for the benefit of both the visitors and the search engine spiders.
Padding, a border and a box shadow have been added to the container. Reduce the browser width to see the responsive action.
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.