Strange behavior of thumbnails

[christine]

Hi,

in previous post I wrote:

But I saw for example 1 image: ...//phoca_thumb_l_the-alhambra-granada-spain-3-1230156_web.jpg and it's not cropped (i-frame).

So, you mean the: Detail View? Which image you do mean exactly?

Kind regards
Christine

[Socrates_mx5]

So, you mean the: Detail View? Which image you do mean exactly?

Yes. I'm sorry for not being better with the terminology.

To see the cropping at the top of images in portrait in Detail View, then a good photo is the one named "Cordoba Mosque". There one can see that the top of the image gets cropped in Detail View in comparison with its thumbnail.

.../photo-gallery/5-general/detail/40-cordoba-mosque-spain-2-1555004-web

[christine]

Hi,

yes, can see now that's cropping at the top of the image (Detail View).

Did you already check as mentioned in previous post:

About cropping: https://www.phoca.cz/documents/2-phoca- ... e-joomla-3

Crop Thumbnails (None | Only large thumbnails | Only medium thumbnails | Only small thumbnails | Large and medium thumbnails | Medium and small thumbnails | Small and large thumbnails | All) Set which thumbnails should be cropped

Kind regards
Christine

[Socrates_mx5]

Did you already check as mentioned in previous post:

About cropping: https://www.phoca.cz/documents/2-phoca- ... e-joomla-3

Crop Thumbnails (None | Only large thumbnails | Only medium thumbnails | Only small thumbnails | Large and medium thumbnails | Medium and small thumbnails | Small and large thumbnails | All) Set which thumbnails should be cropped

I just had a quick glance at the information in the link you sent to me. I'll have to have a better look later.

The setting being used at the moment to Crop Thumbnails is: Medium and small thumbnails

[christine]

Hi,

I'm not sure, is it a large one - than it should be OK. Checked several things ......

Saw somewhere an Inline segment:

.pg-detail-view {
position: relative;
top: 50%;
transform: perspective(1px) translateY(-50%);
}

Try to add to your custom.css or user.css:

.pg-detail-view {
top: 100% !important;
transform: perspective(1px) translateY(-50%);
}

and maybe to change the transform.

Kind regards - need break now
Christine

[christine]

Hi,

you changed from Shadow Box (Image Only) to: Shadow Box > it's iframe methode.
Means:
a) Image Method = Display of original picture possible.
b) Iframe Method = Display of original picture is not possible.

Try (also) with other Detail View, e.g. Highslide JS etc. but: Image Method.

Kind regards
Christine

[Socrates_mx5]

you changed from Shadow Box (Image Only) to: Shadow Box > it's iframe method.
Means:
a) Image Method = Display of original picture possible.
b) Iframe Method = Display of original picture is not possible.

Try (also) with other Detail View, e.g. Highslide JS etc. but: Image Method.

I've had a longer break

Thanks Christine for the explanation of the different methods. Then I believe it might be the iframe methode that crop the top of the image in Detail View.

I've tested Highslide JS (Image Only) and then the entire image is shown in Detail View. The disadvantage with this "Viewer" is that it's not responsive, so it doesn't work that well on Smartphones.

With Boxplus (Image Only) the Detail View can't load images in portrait format. It's the same result with Magnific (Image Only), Modalbox (Image Only), ShadowBox (Image Only) and PhotoSwipe. When it comes to PhotoSwipe, then the original problem with shrunk thumbnails of the images is till there.

The best choice at the moment seams to be Highslide JS (Image Only). It's a pity it doesn't resize, which makes it less useful on Smartphones

I got the impression that many of the issues that I've come across might be related to how Phoca Gallery is integrated with the different modules for Detail View.

[Socrates_mx5]

Just checked how Highslide JS (Image Only) works on a Smartphone and it works better then it did when I just minimized the width of the window on the computer. On the Smartphone one get nicely looking navigation arrows on the screen so it's possible to navigate and use it on a Smartphone. The setting I use for "Highslide JS Slideshow" is Standard.

There is a problem with the icon of comments and GEO-location in the category view on the Smartphone, because they are magnified, but the icon for links is not. Since it's just some of the icons that resize out of proportion, then I believe it should be possible to solve.

[christine]

Hi,
as the thread is very long now - containing different subjects etc., just to make a summary:

With Boxplus (Image Only) the Detail View can't load images in portrait format. It's the same result with Magnific (Image Only), Modalbox (Image Only), ShadowBox (Image Only) and PhotoSwipe.

for reminder:

a) Image Method = Display of original picture possible.
b) Iframe Method = Display of original picture is not possible.

When it comes to PhotoSwipe, then the original problem with shrunk thumbnails of the images is till there.

but this belongs to the Category View and not Detail View.

Socrates_mx5 wrote: The best choice at the moment seams to be Highslide JS (Image Only). It's a pity it doesn't resize, which makes it less useful on Smartphones

Now new subject:

Socrates_mx5 wrote: There is a problem with the icon of comments and GEO-location in the category view on the Smartphone, because they are magnified, but the icon for links is not. Since it's just some of the icons that resize out of proportion, then I believe it should be possible to solve.

The icons are not magnified:



Do you mean, if you display them? They are in an i-frame. Don't know at the moment, how to solve it.

Kind regards
Christine

[Socrates_mx5]

Yes, when using Highslide (Image Only) as Detail Window, then it works pretty good. I just need to find a solution so two of the icons do not get magnified on Smartphones

This is what it looks like on an Android Smartphone:

https://imgur.com/a/Y0WG6Er

This is what it looks like on an Android Tablet:

https://imgur.com/a/0LeTnEJ

Out of four icons, there're only the two icons for comment and GEO/location that gets magnified. The two icons for links are shown as they should.