Home / Forums / ePix Support / Lighbox Overlay not working in Chrome Mobile (iphone and ipad)

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts

  • zistudios
    Participant

    Hi,
    when I click the images on my home page when using Chrome on both my iPad and iPhone, the images opens but the overlay that darkens the background also darkens the image. This doesn’t happen 100% of the time, but 98% of the time it does. To reproduce it, use Chrome on an iPhone or iPad and go to http://www.delaunfuller.com. click on any image in the mansonry grid that loads. If the image lightbox works correctly, scroll up and down a bit and try again. Once it fails to work correctly, it consistently fails. Thanks!


    zistudios
    Participant

    Checking in to see if there is an update on this request. Thanks.

    Andy
    Andy
    Keymaster

    Hi,

    It looks like Chrome is having a hard time with the “position:fixed” value. It’s when you scroll down the page is when the issue occurs. To prove this, I changed the “position:fixed” to “position:absolute” and the issue doesn’t occur. The downside is the black background isn’t anywhere to be seen when you scroll. it’s one of those annoying issues which resides within the browser itself and it’ll most likely be just mobile Chrome too.


    zistudios
    Participant

    If the only downside is the removal of the black background, I can probably deal with that. Where did you make the update so that I can do the same in the future if needed, and more importantly know how to undo it if Chrome fixes their issue. Thanks!

    Andy
    Andy
    Keymaster

    I placed the CSS into Appearance > Theme Options > Customize > Custom CSS.


    zistudios
    Participant

    Thanks. I’ve made a change to the CSS to just remove the overlay completely. I really don’t like it being there partially, especially on larger desktops where you can clearly see that it doesn’t cover the page. I tried moving the text just to the mobile CSS, but it looks like on the ipad the mobile CSS isn’t invoked. So, now it is hidden on all pages. Some google searching said that changing the z-index should do the trick, but that didn’t work for me. Apparently this is an issue that many have faced. If you come up with a way to have it work on chrome mobile, please let us know. Thanks again!

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.