Peter Berger

Hi @janzeman,

Thanks again for the update. For some reason, it just won’t work for me. 🙁

Indeed, in the screen video, I sometimes did a long tab on a photo, precisely to show the difference compared to other moments when I touched the photos briefly. Naturally, I also tried the short touches also.

The setting gallery-buttons-on-mobile="always" works as expected, but when I use gallery-buttons-on-mobile="on-tap", the buttons really don’t appear. It is strange that it works on your iPhone 12 mini but not on mine!

To give you an idea of ​​the behavior I would expect (and I think another average user would too), I installed version 2.0.3 and made another screen video: https://youtube.com/shorts/j-bHnCgVFSU

If I touch a photo during and after scrolling, you see the photo lights up a bit and the toggle button appears. That is perfect, and I would expect that for the download button (and link button) as well.

I can fully understand that you feel you have done enough to improve it and that you are therefore leaving it at that. I would find that understandable. However, should you not wish to leave it at that, I would suggest checking what in version 2.0.3 causes the toggle button to behave as I would expect, and whether you can apply that to the download button as well.

Thank you very much in advance for your reply!

Kind regards,
Peter

Hi @janzeman,

I just tested it: the flickering images are gone!

Thanks a lot!
Peter

Hi @janzeman,

Many thanks also for implementing this improvement! You managed to get this done in no time again; my gratitude and admiration for your skills are immense!

I wish I could program that well myself. I am quite proficient in VBA programming (in Excel and Access) and I am reasonably skilled with HTML and CSS, but I never taught myself to program in PHP and JavaScript. Perhaps I should put some time into that after all, especially now that it should be a lot easier/faster thanks to the help of AI.

Enjoy your weekend!

Peter

Hi @janzeman,

You are really awesome! Many thanks again for these improvements!

I have installed the new version and already have a few “wishes” ;-).

You’re welcome for the coffee. If I had lived near Copenhagen, I would have loved to drink that coffee with you in a barista bar! 🙂

Hi @janzeman,

I’m sorry it took me so long to reply.

Last night I found some time and installed the update and ran a few tests. However, I didn’t have enough time to respond to your message and share the test results with you.

First of all: it’s really great that you managed to get videos playing; I’m very happy with it! It’s also really cool that you can define the color of the controls! Thank you very much for the improvements!

I hope you don’t mind if I also mention a few points that could be improved.

• The fullscreen-toggle="click" attribute works well when clicking on a photo, but a video is only displayed in full screen if you click on the small square. Is it possible to make the “single click” work when clicking on a video as well?
• When I view the gallery via a smartphone (iPhone), the video does play if I click directly on the play button in the gallery, but clicking on the video button in full screen doesn’t work.
• After switching to full screen on a smartphone, navigating via the arrows only works the first time you click an arrow. After that, you can only move to the next/previous photo by swiping.
• The background-color attribute currently applies to both the gallery background and full screen background. For the gallery, I find a transparent background logical/desirable (so that the page background is the leading factor), but not for full screen. Is it possible to create an attribute fullscreen-background-color and set it to black by default?
• What exactly is the attribute fullscreen-slideshow supposed to do? I see no difference between “true” and “false”. I would like to disable the slideshow, but this doesn’t work. Of course, I can change the #jzsa-gallery-1-slideshow .swiper-button-play-pause:after to “display: none;” via CSS, but it would be neater to manage this via an attribute.
• Where should the download button appear if I use show-download-button="true"? I don’t see it appearing anywhere.

Since I notice that you are putting a lot of time into improving the plugin and making it user-friendly, I do hope you take it easy and, above all, think about your sleep! 😉

I’ll hear from you again soon.

Kind regards,
Peter Berger

Hi @janzeman,

I must admit that my previous test was rather rushed, which is why I only added mode=”grid” to the shortcode. My expectation was that the default settings would correspond to the behavior I personally found logical, but I realize it was quite easy to assume it would work as I expected. In the meantime, I have studied the settings page and made good use of the great “playground-option” to perform more testing and set the behavior as I prefer.

Here are some more findings:

• It seems that only a hex code works for the background color. With background-color="transparent", it falls back to #FFFFFF, which is visible if you adjust the “background-color” of #content. On this page, I made the background color yellow so you can see that the background-color of the grid and slider is not transparent. If I set it to a hex code it works as expected.
• I don’t see a download button anywhere when I use show-download-button="true" in the shortcode.
• I played around a bit with image-fit and grid-sizing-model, but with grid-layout="justified", I can’t get the same layout as in Google Photos. A photo in portrait mode fills the width, but not like in Google Photos where the entire photo is visible and there is no empty space around it. In the justified layout, the columns always remain the same width, except for the last row where two photos fills the full width.
• On my iPhone (tested with Chrome and Safari), I do see the navigation arrows, but when I tap on them, nothing happens. Only swiping works to go to the previous/next photo.

Enjoy your weekend, I’ll hear from you again soon. 😉

Best regards,
Peter

Hi @janzeman,

I’ve done some testing, and here are my findings.

• The photo grid displays correctly and neatly.
• Clicking on a photo does nothing; a lightbox doesn’t open to display the full image.
• When I look at the source code, I see two primary divs; the first has the class “jzsa-grid-shell” and the other has the ID “jzsa-gallery-1-player” (this one is hidden: fixed position outside the window).
• Within the first div (jzsa-grid-shell) is another div (jzsa-gallery-1) containing the gallery images with an img-tag, but without an a-tag around it. That’s probably why clicking on the photo doesn’t show a larger version.
• The second div (jzsa-gallery-1-player) appears to contain the default swiper slider. If I adjust the CSS to display it within the screen, I can click the rectangle in the top right corner to display the photos in full size and navigate.

I ran the test in this test environment and, just to be sure, also in this test environment, where I got the same result.

Does it work in your test environment? Can you elaborate on the above findings?

Kind regards,
Peter