Topic: Lightbox gallery with different image sizes
Hi,I want to set up a lightbox gallery with different image sizes.It's no problem for me to get the sizes of the image, i.e. in fullscreen mode the images are shown the right way. But the image grid looks displaced (see actual behavior).
I tried to show you the expected behavior with the snippet below with easy CSS styling that works only for these example image sizes.
What's the solution for that issue?
Actual behavior https://mdbootstrap.com/snippets/jquery/mhorwath/1970794
Expected behavior https://mdbootstrap.com/snippets/jquery/mhorwath/1970802
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Open
- User: Free
- Premium support: No
- Technology: MDB jQuery
- MDB Version: 4.14.1
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: Yes
Grzegorz Bujański staff commented 5 years ago
Hi. Look at the examples on our page. Everyone rows have image with same resolution. In your example you can set first image as last. At this moment we don't support use images with different resolutions in the same row. If you need this, you should use your own styles.
m180 commented 5 years ago
Thanks for your reply but it's not really a satisfying answer. I can not move the images around because they are loaded dynamically in a certain order. I'm looking forward for a better solution within the next releases...
Grzegorz Bujański staff commented 5 years ago
Sorry about that. Only one solution at the moment to achieve this is use own styles.