Hero or Viewport Height Slider

This slideshow can be set up as a hero slider with responsive width and fixed height or a viewport height slider. There is also the option to have a different fixed height or viewport height on mobile phones.
Since the images required are fairly large, they are lazy loaded with only the first three having to be downloaded on page load, the rest are downloaded "on demand".
The transition time can be adjusted and the navigation arrows can be turned on/off as required. They are turned off on mobile devices where the visitor will navigate by swiping.
Although there is an option for autoplay - and to set the slide time - it is not advisable to use it.
When used in viewport height mode, there is an option to turn on a "scroll" arrow. This is a chevron down icon which lets visitors know that there is more content below.
Info Overlay
The info overlay is centered horizontally and vertically and has options for a heading, text and a CTA style link. The font can be web safe or non websafe or Google hosted with a web safe fallback.
There are controls for setting the heading font size, style and letter spacing, the text font size, the font color and the overlay background color and its opacity. The vertical spacing between the items can also be adjusted.
The link has controls for setting the font size, color, hover color, background color and opacity and the border width.
The links can be configured to open an internal or external page and in a new window if required.
Height
For a full width, fixed height hero style slider, the height is set in pixels. Changing this to viewport height is just a matter of checking a box.
A different fixed height can be set for mobile phones or it can be viewport height. These settings are independent of the ones for when the page is viewed on a computer or tablet so, for example, the slider can be fixed height on larger devices and viewport height on mobile phones.
Scroll Down
A viewport height item usually needs some indication that the vistor should scroll down to view more content. The slider has an optional chevron down arrow that can be styled the same as the navigation arrows with controls for color, hover color and background color and opacity.
Clicking or tapping the arrow will scroll down to reveal the next item on the page. A small jQuery plugin is used to create the smooth scrolling action.