Gallery Issue on Chrome Browser & Mobile

[jillianm]

Hello,

First off awesome theme. I have a couple issues that I am experiencing and wanted to see if you can resolve them.

1) Chrome Browser Short Code Gallery Issue on desktop:
When you go to the page in the Chrome Browser: http://marketingcounterintelligence.com/SeasonedCatering/menu/
– you will see that the last photo is really big it lines the images up in 3 rows, first and second row have 4 images each and then the third row is one large image, however in the other browsers the images line up 4 in the first row with various widths and the second row of 5 in various width so that the gallery fits nicely.
– How do i control this? I like the way that this looks in the firefox browser with the two rows, first row of 4 images and the second row of 5 images. This looks a lot nicer.

2) Gallery Issue on mobile:
– When you view the gallery on mobile the rollover of the image description does not appear. Is there a way to have this appear?
– When you go to the page on mobile: http://marketingcounterintelligence.com/SeasonedCatering/menu/
— scroll to one of the galleries and put thumb over image… no description like how it works on desktop.

Thank you for your help.

[jillianm]

This reply has been marked as private.

[jillianm]

This reply has been marked as private.

[SeaTheme]

Hi jillianm, thanks for using ZA

1) I have tested your gallery page, it is same result on Chrome and FF. The gallery list result is base on browser size(screen width). Please try to change the images order.

Also for # 1 issue with gallery in Chrome browser. Sometimes the gallery does not show up at all. Please see attached.

Did you resize the browser width(after resize browser, the gallery list will gone)? I have noticed it, it will be fixed soon.

2) The touch screen is different desktop, you can’t use hover event, there is only solution to show the caption aways shown by the css(paste to Appearance / Theme Options / Custom Css).

.touch .collage-caption { transform: translateY(100%); -webkit-transform: translateY(100%); }

Cheers!
Bwsm – uiueux.com

[jillianm]

This reply has been marked as private.

[SeaTheme]

Hi, JM, welcome.

For #1 with the gallery images. Please see the attached screenshots (chrome-gallery.jpg & firefox-gallery.jpg) to see the difference in Chrome vs FF. I am on OS.

I tested your gallery page again, there are same list shown on Chrome and FF(screenshot: https://www.dropbox.com/s/froqeqietbu5z70/za-client.jpg?dl=0 ).

The gallery list rule is base on browser size(screen width or wrap width) and image self size. We use this plugin , there is not option to control list result. you have to change the image order, image size or remove image to change the list result

I think maybe there are different width window on Chrome and FF. Did you use same size browser width on Chrome and FF?

I did not resize the browser to get the gallery to disappear, it just seems to happen after being on the page for a while. I’ve only seen this happen in Chrome. (see attached za-galleryissue-chrome.jpg).

I opened the page url for while, there isn’t the issue. I remove the window resize function in main js file, please replace this js file by FTP, test again(clean browser cache or use private mode)
– download the attached file, unzip it
– login FTP, go to: themes/za-theme/js/
– upload / replace: custom.theme.js

[Author]

Posts