Revolution Slider Full Screen Image

[kcreative]

Hi guys,

Trying to have a full screen image, but the options for the background are greyed out (in the image element). Is there a way to achieve that?

p.s. the overall goal is to have the text elements show before the background - like this example: https://www.balancedbeyars.com/blog-1 So I set the background to be transparent and added an image element instead to use for a background. That way I can control when the “background” will appear on the slider. If there is a different approach to it, would love to hear about it!

[ruenel]

Hello @kcreative,

Thanks for writing in!

If you simply want a full-screen section with some text elements in it, you can actually create a full-screen section with a background image and some text in it.

If you are using the Rev Slider, it is best that your image will be a slider background image and not as an image element in the slide.

Please check out my test page which is a duplicate of your homepage in the secure note.

[kcreative]

Thank you for the quick reply.

The goal is to have a slider, not just a full screen image.

The goal of the full screen slider is to have the text show before the background - similar to the example provided above? Having issues achieving that and your help would be really appreciate it!

Thank you!

[ruenel]

Hello @kcreative,

The background image should be added in the static or global layers so that you can insert different texts in each of the slides while the global background image displays in the background. To know more how you can set up the background images in your slider, please check this out video:

And if you need the text to be responsive, please check this video as well:

Hope this helps.

[kcreative]

Thank you for the video links, but inserting the image in the global layer wouldn’t solve the issue - the slider will have different images, not only one.

Again, the goal of the full screen slider is to have the text show before the background - similar to the example provided in the first message. Is there a way to achieve that?

Thank you!

[christian]

Hey @kcreative,

What you’re after is the timing of layers. To control that, drag the timing handle of the layer to the right and it will be delayed.

For good measure, move the text layer up in the stack so it won’t get covered by the image layer.

For more details about timing , please see the Slider Revolution documentation at https://www.themepunch.com/faq/how-to-change-the-timing-of-slides/

Hope that helps.

[kcreative]

Thank you for the reply again!

The issue, as mentioned above, is when I set an image as the main background layer, there is no option for timing control. And that was the reason I set the image on a different layer, than the main background. But now the new layer is not full screen and the options for background control size are greyed out. Is there a way to have that image to be full screen (or imitate setting an image as the main background layer)?

Recap: trying to have multiple slides which are full screen (an image set as a background) and have the text layer appear before the image.

[friech]

Hi @kcreative,

Ok let’s use the image as a layer, then use the layer alignment (center, center) and width (100%) and height (auto) option to properly position your image and make it full width.

• 

Then play with the timing as Christian said above to show the text before the image fade-in.

The full-screen option is in the Slider Settings > Slide Layout.

Hope it helps,
Cheers!

[kcreative]

Those settings are implemented https://prnt.sc/oyb6ph but the background/image is still not full screen when the screen is bigger than 1920px https://prnt.sc/oyb79p …

[kcreative]

Just resolved it - setting the width to %101 made the image to go full screen by loosing only %1 of it https://prnt.sc/oybaby

[friech]

Glad we could help, Cheers!