Full Width Responsive Image Lightbox Modules
Full Width Image Lightbox Modules Widget

Images

The thumbnail images should be cropped to approximately the size they willl appear on the web page.
The full size images expand up to their actual width and won't go any wider no matter what the browser width is set to.

Full lightbox Widget
ResponsiveImage Lightbox

Image [1] Caption

ResponsiveImage Lightbox 2

Two Line
Caption

ResponsiveImage Lightbox 3

Click The Image To Enlarge

EverWeb Widgets | Full Width

Widget Settings

Check the "Full width" box in the Metrics inspector and set the maximum width.
Set the module minimum height and its width. This width should be no more than one third of the page content width.
Choose the thumbnail image, the corresponding large image and enter alt txt and a caption for each one.
The captions can extend to two or more lines if required. Use HTML5 line breaks <br> for returns. Adjust the module minimm width to suit the image & caption with the largest height.

Styles

Enter the font family name, check the box if it is Google hosted, choose a suitable web safe fallback font and set the font size and color.
Set the text align and line height.
Set the container background color and its opacity.
Set the border width, color and corner radius if required.
Set the box shadow radius and color if required.
Adjust the container padding if necessary.

Scroll Options

The widget can be fixed in position by selecting it and checking the "Fixed position" box in the Metrics inspector if it is being used with a slide over layer.
The modules can also be made to fade on scroll by checking the box and setting the scroll distance.

Full lightbox Widget

This widget is included in the Full Width widget pack.