[Resolved] background image issue (again)

Home Forums Support background image issue (again)

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #246001
    dasigna

    i know that this is no new issue at all, but i cant getting it solved properly up to now:
    i’ve set a global bg image to body in GP. full width (cover) and fixed.
    so this works great on desktop and mostly all mobile devices and browsers (some exeptions) but not at all on ios-devices, mainly ipad.

    the strange thing is that the image is there, but doesnt seem to follow the viewport (as intended) but the whole size of the page or content (experiencing this when page content amount is quite different).
    tried a few ‘solutions’ already that can be found out there on the web, but none seems to work without issues, and ios devices seem to be quite hard to trick out – but there are lots of out there, so they should be paid attention to as well…

    so whats really the best way to solve this, and force the bg to follow all viewports???

    #246045
    Tom
    Lead Developer
    Lead Developer

    I believe setting it to “Fixed” forces it to stick to the viewport as the image doesn’t scroll.

    It looks like iOS has trouble with fixed attachments: http://stackoverflow.com/questions/23236158/how-to-replicate-background-attachment-fixed-on-ios

    #246194
    dasigna

    yep. ‘fixed’ should force the bg to stick to the viewport. but thats not the case on ios.

    ios seems to have ‘trouble’ with fixed for a long time – looks even more like this is not supported or supressed.
    and it seems its hard to deal with.
    what i am looking for is a way to deal with, with pure css! eighter could change the attachment to ‘scroll’ for ios, or much better implement something that forces ios to show the fixed.
    and the question for me was, what might be the right way for GP or if you might have an idea or solution, because so far nothing really worked well …

    ???

    #246235
    Sebastian

    Hi dasigna,

    try the plugin https://wordpress.org/plugins/easy-backstretch/. You can use this plugin with one image or more. This plugin is not the best solution, because it doesn’t take or save images in the media library, but it works.

    I had to struggle with the same problem. For me, the plugin solves the problem.

    You can also try this manual solution (jQuery plugin):
    http://srobbin.com/jquery-plugins/backstretch/

    I hope, that helps.

    Sebastian

    #246253
    dasigna

    @sebastian thanks.
    the plugin seems to be a little outdated… but will see if i try the manual one.

    got it solved for elementor-sections with full-width-bg by setting an @media-rule for mobile devices by forcing the background-attachment to scroll. (can live with this for the moment until finding a better solution).
    but think that this only works because they are set within divs… so that doesnt do the trick for gp-body-background so far.

    would still prefer a simple css workaround … πŸ™‚

    #246317
    Tom
    Lead Developer
    Lead Developer

    I’m not sure a simple CSS workaround exists, but I’ll definitely keep an eye out for it πŸ™‚

    #246336
    dasigna

    … issue solved – no! πŸ™


    @sebastian
    : can you show me a site where this works on ios-devices?????????
    tried the backstretch thing… it sets the image right according to viewport, but the again its scrolling with content, and rest of page leaving blank bg.
    so thats no solution anyway.


    @tom
    : is there a way to put it as bg into div that covers the whole body? cant get that to work …

    damn apples!

    #246349
    Sebastian

    Here I use the plugin: http://bode.codable.de/

    If you scroll, the image jerks a bit up and down. But if you stop scrolling, it fits again.

    As I said, it is not an optimal solution, but I can/have to live with that, for now.

    Here is another plugin from Pippin Williamson: https://wordpress.org/plugins/simple-full-screen-background-image/

    #246366
    dasigna

    o.k. tested both again:
    easy backstretch works now (dont know why not before…) with same ‘issue’ as on your site; the little flip up and down when rescaling/recovering bg.
    simple full screen also works, again with little flip, but smoother. only disadvantage: it squeezes the image on portrait mode.
    so stay to the first by now. better than every attempt before!

    grΓΌsse nach magdeburg und danke nochmals! but lets stay to the language of the forum we’re in, so big thanks again πŸ™‚

    #246377
    Sebastian

    Danke und gerne. πŸ˜‰

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.