[brightshinyParticipant]

Hello,

I’m using Slider Revolution to create consistent headers across a site (this was suggested by theme support). It’s working well, for the most part. The issue I’m having is that my background image is being placed in an awkward way on mobile/tablet (portrait). So I was trying to add an image layer over the background for mobile/tablet, that places the image correctly.

1) Is this the best way to go about this, or is there a better way?

2) For whatever reason, I cannot get the image layer to go underneath the other layers. So this image layer covers other text layers. I’ve adjusted the layers in the timeline and this does not correct it.

I am new to Slider Revolution, so apologies if the answers to these questions are painfully obvious.

Thank you so much for your time with this.

cb

[brightshinyParticipant]

This reply has been marked as private.

[Rue NelModerator]

Hello CB,

Thanks for writing in! With slider revolution, you can easily move around the layers. It is not just moving where you want it to position but also how the layers at stack on top of each other. Simply scroll down below your slider editor find the Layers Timeline. You can drag a layer and place it where you want it to be if whether it appears on top or at the back of another layer. In this section you can find the z indexes of all your layers.

Hope this helps.

[brightshinyParticipant]

Hello,

Thanks for the explanation. However, I already knew to do that. And I am attempting to stack the layers exactly that way. That’s what has me confused. Even when I drag an image layer to the bottom of the Layers Timeline (so should be under everything else), it still is visually overtop of other layers in the editor window above, and when I save/output, it is indeed overlapping all the layers that are on top of it.

I sent login credentials in a previous reply. But please let me know if you need them again, and I will send a private reply.

Also, my other question about whether or not adding an image overtop of a background image is the best way to go. Ideally, I’d like to be able to affect the position of a background image, based on the breakpoint. Is this possible? OR is there another way around this issue – the issue being that some of my header images are cropped awkwardly on mobile/tablet, so I’d like to be able to position them differently on those devices.

Thank you so much for your time with this. I hope we can resolve today, as I have a deadline.

Appreciate your help!
cb

[JadeModerator]

Hi CB,

I would love to check the current setup of your slider but I will need the admin details to your site. I tried the details you have provided previously but it seems to be only working for the access for the page itself.

As for your second question, having an image over a background image should work fine. Although it is normal that the background image will have some sections automatically get cut off in the page display on mobile due the page’s responsiveness. We could, however, change the positioning of the background image through CSS media queries.

[brightshinyParticipant]

This reply has been marked as private.

[brightshinyParticipant]

This reply has been marked as private.

[JadeModerator]

Hi Caroline,

Is that you wanted the woman in the image to remain in the display even in mobile screen? If so, please try adding this CSS:

@media (max-width: 767px) {
    #rev_slider_10_1 .slotholder .tp-bgimg {
        background-position: 100% 0 !important;
    }
}

Hope this helps.

[brightshinyParticipant]

Thank you! That worked to move the background image. But I am still wondering why another image that I place on a separate layer covers all other layers, EVEN WHEN it is the lowest layer on the editor timeline. Yes, I have dragged the layer to the lowest point in the stack of elements on the timeline. But the image still appears to cover all layers above it, both in preview mode and when on an actual mobile device.

The slider in question is called About2 – on the mobile screen there is an image dragged off to the side (so the client doesn’t see the issue while the site is currently under review). This is the image I am asking about.

Thank you for your time with this.
cb

[RadModerator]

Hi there,

Which layer should be on top? Attached is the screenshot of what I’m getting. Should the image cover the texts?

Thanks!

[skearsyParticipant]

Sorry to jump in on this but did you ever work out how to do this? – ‘I cannot get the image layer to go underneath the other layers. So this image layer covers other text layers. I’ve adjusted the layers in the timeline and this does not correct it.’…?

I’m having the same issue and was hoping to find the solution in this thread but it seems to have ended so I wonder if you worked it out??

Thanks!

[FriechModerator]

Hi There,

Please create a separate thread, and then on that thread provide us login credentials in private post and clarify what you’re trying to do.

The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions.

Thanks.

[Author]

Posts