Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #997629

    I’ve created a single image fullscreen slider that works well on desktop. It stays fixed and page scrolls fine. But on mobile devices, the image scrolls with the page and does not retain a fixed position. I’ve tried some adjustments in Quick CSS but it either has no effect or ends up breaking other elements. Any ideas?

    #997863

    Hey jaybarr,

    Thank you for using Enfold.

    The background attachment “fixed” is partially supported on iOS and is not supported on Android, which is why it’s not working on mobile devices. Unfortunately, we can’t do much about it.

    // https://caniuse.com/#feat=background-attachment

    KNOWN ISSUES
    iOS has an issue preventing background-attachment: fixed from being used with background-size: cover – see details
    Chrome has an issue that occurs when using the will-change property on a selector which also has background-attachment: fixed defined. It causes the image to get cut off and gain whitespace around it.
    Firefox does not appear to support the local value when applied on a textarea element.

    You can set the will-change property to transform but I’m not sure if that’s going to help.

    div[data-image_attachment="fixed"] {
        will-change: transform;
    }

    Best regards,
    Ismael

    #997972

    Thanks, Ismael! I’ll give your snippet a try, but mainly I guess I’ll keep rooting for browser updates. :)

    #998225

    Hey!

    I guess I’ll keep rooting for browser updates.

    Yes, that’s all we can do for now. Please feel free to open a new thread if you need anything else. :)

    Best regards,
    Ismael

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Fullscreen Slider Fixed Position doesn't work in mobile’ is closed to new replies.