Collage lanscape cut vertical images

coro085 · August 8, 2013

In Lanscape Collage vertical images are cropped, you can not see them whole in the original size or even XL.
Or I did not understand.
Collage landscape is the only reason positive than the old SmugMug.
This is a serious lack.
www.romeocolombo.com
Thank you for a solution

jwashburn · August 8, 2013

coro085 wrote: »

In Lanscape Collage vertical images are cropped, you can not see them whole in the original size or even XL.
Or I did not understand.
Collage landscape is the only reason positive than the old SmugMug.
This is a serious lack.
www.romeocolombo.com
Thank you for a solution

Are you talking about in a gallery or in a site layout? When in a gallery, you can click on Orginal and it works fine. It shows the whole site. If you are in Collage Portrait, make sure your thumbnails are not set to square. That will crop your images?

coro085 · August 8, 2013

Thanks reply

I tried again but don't work.

I prefer Collage Lanscape, it enhances large landscape

When you select a photo it switches to type slideshow and here the picture is cut ( in original or even in XL)

Greetings

Ferguson · August 8, 2013

coro085 wrote: »

Thanks reply

I tried again but don't work.

I prefer Collage Lanscape, it enhances large landscape

When you select a photo it switches to type slideshow and here the picture is cut ( in original or even in XL)

Greetings

EDIT: I see you had examples, but I'm not quite sure which images are wrong, none jumped out at me. Can you point to one, or a screen shot?

All of mine are college landscape, and I like it a lot -- the whole image is in both the "thumbnail" as well as the full image. I'd rather have a better fit to the screen in full (i.e. fully to one edge of the browser) but it's not too bad.

thenickdude · August 8, 2013

I believe OP is referring to the fact that if you view a portrait image in the lightbox, it gets cut off at the top if you manually choose a size on the Image Sizes menu which is taller than the screen. I think there is no problem if you use the default "fill" size though.

RichmondImage · August 8, 2013

I am having the same issue. It wouldn't be noticeable if those goddamn watermarks could be taken off the thumbs, I'm on a phone but my site is richmondimage.net and you can see them on almost every gallery

Ferguson · August 9, 2013

Lamah wrote: »

I believe OP is referring to the fact that if you view a portrait image in the lightbox, it gets cut off at the top if you manually choose a size on the Image Sizes menu which is taller than the screen. I think there is no problem if you use the default "fill" size though.

I'm slow today, but if you choose an image that is taller than the screen don't you expect it to cut off the top (or bottom or something)?

thenickdude · August 9, 2013

Ferguson wrote: »

I'm slow today, but if you choose an image that is taller than the screen don't you expect it to cut off the top (or bottom or something)?

No, I expect to be able to scroll the browser window to see the entire image. You can scroll down to the see the bottom part of the image, you can scroll left and right to see that portion of the image, but you can't scroll up to see the top ~10% of the image.

For example, check out this photo in the default Fill lightbox:

http://www.sherlockphotography.org/Other/Anime-figure-collection/i-MNShg5m/A

Now use the Image Sizes menu in the bottom right to change to X3-Large, the head gets cropped off but you can still scroll down to see the very bottom of the photo. If the image didn't end up getting cropped, resize your browser window shorter first.

Ferguson · August 9, 2013

Lamah wrote: »

No, I expect to be able to scroll the browser window to see the entire image. You can scroll down to the see the bottom part of the image, you can scroll left and right to see that portion of the image, but you can't scroll up to see the top ~10% of the image.

Ah... I had not noticed that. I guess all the ones I tried were cropped a bit looser and didn't notice the top cut off. Sorry for the diversion and thanks.

coro085 · August 9, 2013

View this photo, lacks the entire upper part in original size
http://www.captivephotons.com/Aviation/Gathering-of-the-Giants-2008/i-LBq4jQD/A
http://www.captivephotons.com/Aviation/Gathering-of-the-Giants-2009/i-2nxQGcQ/O

This is ok
http://www.captivephotons.com/Travel/Southeast-Driving-Vacaton-May/i-hw39tVD/A
http://www.captivephotons.com/Friends-Family-Surrounding/Florida-Life/i-3P2BHfR/A
http://www.captivephotons.com/Travel/Vacation-May-2012/i-LVNFHp2/O

The solution is here, but where is?

mbonocore · August 9, 2013

coro085 wrote: »

View this photo, lacks the entire upper part in original size
http://www.captivephotons.com/Aviation/Gathering-of-the-Giants-2008/i-LBq4jQD/A
http://www.captivephotons.com/Aviation/Gathering-of-the-Giants-2009/i-2nxQGcQ/O

This is ok
http://www.captivephotons.com/Travel/Southeast-Driving-Vacaton-May/i-hw39tVD/A
http://www.captivephotons.com/Friends-Family-Surrounding/Florida-Life/i-3P2BHfR/A
http://www.captivephotons.com/Travel/Vacation-May-2012/i-LVNFHp2/O

The solution is here, but where is?

Ahhhh yes, now I see....I will file this now. Thanks!

thenickdude · August 10, 2013

I've made a fix for this SmugMug bug now:

/* Fix lightbox cutting off top of images when the page is scrollable */
.sm-lightbox-scrollable .sm-lightbox-image {
	margin-top:0 !important;
}

You can see it in action in my gallery here, switch to X3 large and there's no decapitation:

http://www.sherlockphotography.org/Other/Anime-figure-collection/i-MNShg5m/A

coro085 · August 11, 2013

Vertical pictures now see 100%, no cuts.
Thank Lamah.

Is perfect, now my vertical pictures are visible at 100%.

But these frames are still cut
http://www.captivephotons.com/Aviati...08/i-LBq4jQD/A
http://www.captivephotons.com/Aviati...09/i-2nxQGcQ/O

thenickdude · August 11, 2013

I can't see the fix CSS code on those pages. Did you add it to your Theme's CSS, or did you add it as a CSS Block on just one page?

thenickdude · August 11, 2013

It looks like your web browser has automatically translated the CSS into Italian

You currently have:

. Sm-pagina-Widget-gallerie. Sm-piastrelle-centro-immagine img.sm-tile-portrait {
  top: 0;
  -Webkit-transform: translate (0,0);
  -Moz-transform: translate (0,0);
  -Ms-transform: translate (0,0);
  -O-transform: translate (0,0);
  -Webkit-transform: translate (0,0);
  trasformare: tradurre (0,0);
}

The original code is:

/* 
 * Instead of vertically centering portrait images within their tiles (a 50% shift downwards), 
 * top-align these to prevent peoples' heads from being cut off.
 */
.sm-page-widget-galleries .sm-tiles-center-image img.sm-tile-portrait, 
.sm-page-widget-nodes .sm-tiles-center-image img.sm-tile-portrait, 
.sm-page-widget-pages .sm-tiles-center-image img.sm-tile-portrait, 
.sm-page-widget-folders .sm-tiles-center-image img.sm-tile-portrait {
  top: 0;
  -webkit-transform: translate(0,0);
  -moz-transform: translate(0,0);
  -ms-transform: translate(0,0);
  -o-transform: translate(0,0);
  -webkit-transform: translate(0,0);
  transform: translate(0,0);
}

That's the code I wrote to stop the top of images being cut off in the thumbnails for your folders and galleries (like on this page), if you have tall featured images. I describe that code here:

http://www.sherlockphotography.org/Customisations/Avoid-cutting-off-heads

thenickdude · August 11, 2013

Okay, cool!

coro085 · August 11, 2013

I have found here the CSS, see jpg.

Collage lanscape cut vertical images

Comments