Viewing 9 posts - 31 through 39 (of 39 total)
1 2
  • Author
    Posts
  • October 7, 2019 at 9:03 am #1145683
    Real-3D

    Hi and thanks for the answer.
    Where can I find css media query? I moved the code provided in Enfold-general styling-css. Isn’t it the right place?
    Thanks and best regards.

    October 7, 2019 at 2:17 pm #1145774
    Rikard

    Hi,

    Ismael posted a media query for you already: https://kriesi.at/support/topic/masonry-gallery-issue-when-mage-is-open/#post-1144373, all you need to do is to move the CSS into it.

    Best regards,
    Rikard

    October 8, 2019 at 8:54 am #1146051
    Real-3D

    Hi and thanks.
    I used Ismael’s media query with CSS in it, but i have 2 issues:

    1- on mobile i can scroll up and down with fingers when the lightbox is open and it moves up and down
    2- on desktop the only problem is that when i open the images lightbox the “background” images list behind the lightbox moves to the top and when i close the lightbox it goes down to the opened image. I’d like it to be fixed.

    Is there a way to fix these problems?
    Thanks, and sorry if I’m so fussy and scrupulous about setting up my galleries!
    Best regards

    October 9, 2019 at 12:35 pm #1146498
    Guenni007

    small addendum: sometimes there are other elements between the mfp wrapper and the wrap_all. So wrap_all is no longer a direct neighbour.
    Therefore you should rather use this one:

     /* instead of the code ( direct neighbor ) */
.mfp-wrap + #wrap_all {
  position: fixed !important ;
}
/* this here ( General Sibling Selector ) */
.mfp-wrap ~ #wrap_all {
  position: fixed !important ;
}


    so it is now:

     .mfp-zoom-in.mfp-ready.mfp-bg, .mfp-zoom-in.mfp-ready .mfp-preloader {
      opacity: 0.8;
  }

  .mfp-content {
    position: fixed !important;
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    overflow: hidden;
  }

  .mfp-arrow {
    position: fixed !important
  }

  .mfp-wrap ~ #wrap_all {
    position: fixed !important ;
  }

  img.mfp-img {
    max-width: 70vw;  
    padding: 10px 0 !important;  
  }

    PS : it is clear that if you put it in a media query only for screens bigger than 768px – that the code does not work below this screen-width

    October 11, 2019 at 8:11 pm #1147236
    Victoria

    Hi Real-3D,

    Have you tried Guenni007’s solution? Is it working for you?

    Best regards,
    Victoria

    October 14, 2019 at 11:05 am #1147800
    Real-3D

    Hi and thanks.

    I’ve tried Guenni007’s CSS but it have the same previous problems:

    1- on mobile i can scroll up and down with fingers when the lightbox is open, and it moves up and down
    2- on desktop the problem is that when i open the images lightbox the “background” images list behind the lightbox moves to the top and when i close the lightbox it goes down to the opened image. I’d like it to be fixed.

    Best regards

    October 18, 2019 at 5:47 am #1149102
    Ismael

    Hi,

    Sorry for the delay. Could you give us a screenshot of the layout that you want for the lightbox? You can upload it to imgur or dropbox. I think our suggestions and @Guenni007’s got mixed up, which is why the solutions don’t work.

    Best regards,
    Ismael

    October 18, 2019 at 12:19 pm #1149238
    Real-3D

    Hi and thanks.
    Maybe a video is better than an image. I link here the wetransfer link to download an explain video (i have no imgur or dropbox account…).
    https://wetransfer.com/downloads/0160c14503f66c4be9dedbd641b00ac320191018101709/92c640a2f93ea0028a4bc66efea2472d20191018101709/102dd8

    As i explained the problem is that when i open an image, the “images list” behind the lightbox moves to the top and when i close the lightbox it goes down to the opened image.
    Also, on mobile, i can scroll up and down with fingers when the lightbox is open, and it moves up and down. I’d like it to be fixed.
    I hope I explained myself better.
    Thanks for ypur help and best regards

    October 21, 2019 at 12:12 pm #1149830
    Ismael

    Hi,

    Thank you for the update.

    It scrolls to the top because that is where the lightbox container is. It will then scroll back to the last item that you opened after closing the lightbox container. Unfortunately, we can’t alter that behavior without major modification in the lightbox script. What we can do is provide you with a css that adjusts the opacity of the lightbox container background so that you don’t see the images or content behind.

    .mfp-zoom-in.mfp-ready.mfp-bg, .mfp-zoom-in.mfp-ready .mfp-preloader {
	opacity: 1;
}

    Best regards,
    Ismaele

  • Author
    Posts
Viewing 9 posts - 31 through 39 (of 39 total)
1 2
  • You must be logged in to reply to this topic.