The full width overlay creates a rectangle to use as a slide over layer which can be used with a background image or, in this case, a full width, fixed height image which has been fixed in position using the "Fixed position" control in the Metrics inspector.
In this example, the image has been fixed with its position Y set to zero. The Overlay widget is then added to the page, the "Full Width" box in the Metrics inspector checked and the height set to cover the content area below the image.
The background color has been set to black with about 50% opacity and a top border has been added as a leading edge.
This text content uses the Elements Styled Text widget with the background opacity set to zero.