Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Is it posibble to dynamically change the row height on page resize? #356

Open
isaacfink opened this issue Jul 2, 2021 · 1 comment
Open

Comments

@isaacfink
Copy link

I want the row height to be a ratio of the full width but in resize it needs to Ernst how can I achieve that?

@damott
Copy link

damott commented Feb 23, 2023

Did you ever find a solution? I was just trying to work with justified gallery in combination with lightgallery so that I could change the rowHeight in justified gallery for different screen sizes. I tried the following code, which worked to change the sizes, but it somehow disabled the close button inside lightgallery.

`$(document).ready(function() {
$("#animated-thumbnails-gallery")
.justifiedGallery({
captions: false,
rowHeight: 500,
margins: 5
})

.on("jg.complete", function () {
  var screenWidth = $(window).width();
  var customRowHeight = screenWidth > 768 ? 500 : 300;
  $("#animated-thumbnails-gallery").justifiedGallery({
    rowHeight: customRowHeight
  });
  window.lightGallery(
    document.getElementById("animated-thumbnails-gallery"),
    {
      mode: 'lg-fade',
      download: false,
			thumbnail: false,
			hideBarsDelay: 2000,
      autoplayFirstVideo: false,
      pager: false,
      galleryId: "nature",
      plugins: [lgZoom, lgThumbnail],
      mobileSettings: {
        controls: false,
        showCloseIcon: false,
        download: false,
        rotate: false
      }
    }
  );
});

});`

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants