New Lightbox Zoom Past Maximum Photo Size

Hikin' Mike

While in the lightbox, when you hover the image we get a Zomm Icon. Clicking on it zooms in PAST the Maximum Photo Size. Has this always been that way, or is this new? I don't like it. I don't want to see up-sizing images.

leftquark

The Lightbox zoom functionality is new and in its first (and current) version it would zoom slightly past the maximum display size by zooming into the pixels. Some degradation occurs when this happens. This decision (and actually, it was an additional feature we implemented) was based off feedback specifically from this forum in which all of you described how you wanted to use the "Sizes" button and more specifically, a Zoom feature. In particular, Allens feedback drove a lot of that decision. Though the photo might be a little pixelated, the additional details in that part of the photo could be viewed, which wouldn't be visible if we just stopped (or didn't allow you to zoom at all).

Take this photo, for example:

The photo has hit its Maximum Display Size, which means if we disabled Zoom because we're already at the MDS, then the viewer can't see more of the area around the paddlebaorder. But since it does allow Zooming, visitors can see more of that area, even though it's a bit pixelated:

This is an easy case of being able to change the feature if it's not quite working. We're currently investigating removing the ability to zoom beyond the MDS. That would mean that zoom is disabled if the MDS is set smaller.

Hikin' Mike

If there is a notification (to the potential buyer) that when viewed past MDS it is pixalized and when printed, this won't be present...or something like that, I'm fine with that.

Jtring

@leftquark said:
The Lightbox zoom functionality is new and in its first (and current) version ...

Just a slightly tangential comment on the zoom function. The current version isn't quite the same as the first version of the zoom tool you put out in the Organizer a few months ago. It's an improvement, and even if not perfect, your development team needs thanks for that. If I'm understanding the HTML correctly, in the Organizer-only version, the zooms used the same display copy as the unzoomed image in the lightbox. That almost always led to upscaling. Zooms in today's release use the MDS display copy, which may be higher resolution than the display copy used for the unzoomed image. Upscaling can happen, but it depends on circumstances. Image quality on zooms is often better now than on the Organizer-only version.

As for whether zooming beyond MDS is good or bad, I'm happy enough with the current compromise, perhaps, as Mike noted, with some sort of note.

---

Added note 8/20 -- looking back at my earlier notes and my June 18 post on the subject, the above may or may not be right in all the details. In any case, as @leftquark noted subsequently, the apparent clarity issues with zoomed images seem to depend a lot on the content of the photo, the display hardware, and the resolutions involved. Where there is no upscaling, things seem fine on the explorations I did today. I still personally think upscaling is OK if it's identified.

coro085

The degradation of the photo with the zoom is evident, or it is zoomed well (in the loaded dimension) or better to give the possibility to disable it.
We work hard to make a photo look good and a foolish zoom spoils everything

Shinrya

I would much rather the option to disable zooming altogether to avoid viewers thinking the degradation is evident in the full size image and/or prints of the image.

Is there no way to disable for the time being with CSS?

Allen

I would suggest to only zoom to original (owner) or Max Size (visitor).

CaprockPhotography

I am not happy with this new "feature" and am perplexed why this is not an option to disable. One of the main reasons I was about to become a subscriber was the control over image sizes displayed to users. SmugMug does great job with this. Now, that is all negated by this zooming feature. What happens now is a super-sized photo being produced with my watermarks being removed. Plus, it looks very close to the original file I uploaded. This is perfect for photo thieves. ****So, PLEASE make this optional!!!**** This is a total deal-killer for me. I would post images of what is happening, but I am still too new.

coro085

We pay for our photos to be represented at their best, it is unacceptable that they are degraded.

Shinrya

@CaprockPhotography said:
I am not happy with this new "feature" and am perplexed why this is not an option to disable. One of the main reasons I was about to become a subscriber was the control over image sizes displayed to users. SmugMug does great job with this. Now, that is all negated by this zooming feature. What happens now is a super-sized photo being produced with my watermarks being removed. Plus, it looks very close to the original file I uploaded. This is perfect for photo thieves. ****So, PLEASE make this optional!!!**** This is a total deal-killer for me. I would post images of what is happening, but I am still too new.

Are you looking at your "zoomed in" images in the lightbox whilst logged out of your site? If you are logged in, it displays the original full size when you zoom in. However, if you have set your images to only display at a max resolution for visitors i.e X2/X3 etc then that is all that will be allowed when viewers press to zoom in (with the upscaling issues we're talking about here).

Jtring

I think the following custom CSS code will turn off zooming when it would result in upscaling

/* Turn off the zoom if it would result in upscaling.*/   
.sm-position-relative > div[style*="scale(2)"] {
    transform:scale(1)!important;
}
/* Replace the zoom-in cursor icon with the pointing hand icon*/
.sm-position-relative > div {
    cursor:pointer !important;
}

This is a bit of a kluge, so it may not work if SmugMug adjusts their code. What's I think is going on is that the zoom tool expands the image to the Maximum Display Size (MDS) or by a factor of 2, whichever is greater. The first lines here turn off the zooming in the case where the expansion is by exactly that factor of 2. It, unfortunately, also stops the zoom if the MDS just happens to be exactly a factor of two larger than what's being displayed in the lightbox. If SmugMug ever changes the logic for how they decide how much to expand, this will break. But for now, give it a try if you wish.

The second group of lines changes the cursor icon. I don't see a way to change the zoom icon only in the case where the ultimate scaling factor will be 2, but it is possible to replace the zoom icon universally. This changes the icon to the hand with index finger out. If you would prefer an arrow, change the word pointer to default.

Note both of these need the !important flag because Smugmug did the styling in the HTML rather than write CSS. Bad form, SmugMug! (And yes, I know putting the styling in HTML really means this was a fast "patch" to be cleaned up later.)

Caoimhin

For the record, I don't approve of the zoom feature. How someone can view my images is important to me and I've always preferred to control and limit viewing size. After seeing how the zoom works on my images I see no apparent value to my viewers. On the contrary, it simply produces an undesirable crop effect that detracts from the essence of my work. A photographer/artist should retain the ability to control how their work is displayed. An option to disable the zoom should be provided. I feel very strongly about this - in case anyone is listening.

coro085

Well, for now I disabled the zoom.
Thanks

Allen

Using Firefox and Safari on iPhone 8+ and clicking thumb to enter lightbox.
Pinch to zoom only zooms center of photo.
No mater where you pinch, the photo jumps to center when zooming.

Smugmug app works great but map has no normal/satellite toggle.

In app clicking caption shows full caption but dark overlay hides photo.
I'd suggest only use dark overlay background under caption part of screen.

Seeing this caption view, if photo showed, would be nice if in this view you could swipe to next photos.
Looks like many want full caption visible below photo when scrolling.
But I like just the top line of caption showing back in the LB view.

polaris

@Jtring said:
I think the following custom CSS code will turn off zooming when it would result in upscaling

/* Turn off the zoom if it would result in upscaling./
.sm-position-relative > div[style="scale(2)"] {
transform:scale(1)!important;
}
/* Replace the zoom-in cursor icon with the pointing hand icon*/
.sm-position-relative > div {
cursor:pointer !important;
}

Thank you so much @Jtring for your CSS. Now I can disable the zoom. I just modified a little with the default cursor. I don’t like the pointer cursor. My best wish is to disable the lightbox, but it seems no way :-)

/* Turn off the zoom if it would result in upscaling./
.sm-position-relative > div[style="scale(2)"] {
transform:scale(1)!important;
}
/* Replace the zoom-in cursor icon with the pointing hand icon*/
.sm-position-relative > div {
cursor: default !important;
}

Jtring

Note you can turn off the zoom function completely by making the second line of my code simply

.sm-position-relative > div {

I.e., by removing the square brackets and the stuff inside. As for disabling the lightbox as a whole, no way.

Caoimhin

@Jtring said:
Note you can turn off the zoom function completely by making the second line of my code simply

.sm-position-relative > div {

I.e., by removing the square brackets and the stuff inside. As for disabling the lightbox as a whole, no way.

Thank You @Jtring for providing this work around! Things are back the way I want them at least for the time being. Cheers!

LPC

I personally would prefer to disable the lightbox altogether until this is resolved. I hate this development.

LPC

@Caoimhin said:

@Jtring said:
Note you can turn off the zoom function completely by making the second line of my code simply

.sm-position-relative > div {

I.e., by removing the square brackets and the stuff inside. As for disabling the lightbox as a whole, no way.

Thank You @Jtring for providing this work around! Things are back the way I want them at least for the time being. Cheers!

This does'nt seem to work for me.

Jtring

LPC, Does the original version work? Not much I can do from a distance to troubleshoot unfortunately unless you try to put it in and give me a link to your site. By the way, if it wasn't clear, you still need everything else:
.sm-position-relative > div {transform:scale(1)!important;}

LPC

@Jtring said:
LPC, Does the original version work? Not much I can do from a distance to troubleshoot unfortunately unless you try to put it in and give me a link to your site. By the way, if it wasn't clear, you still need everything else:
.sm-position-relative > div {transform:scale(1)!important;}

Thank you Sir! Just what I wanted.

blouie

It is imperative for me to turn off the zoom mouse cursor completely. I absolutely do not want this, or anything like it. I want the mouse cursor to stay as the regular cursor, period. And I do not want visitors to have any capability to zoom on my images, period.

I see there's CSS code mentioned for disabling the zoom, but it seems that it's modified in a later post.

Would someone please post the entire CSS code altogether.

(I had to turn off Lightbox completely, because I will not tolerate the zoom cursor and its capability. And turning off Lightbox essentially cripples my site. If I can't turn off the zoom, then I will have to find another host, not SmugMug, for my site.)

Thank you for your help.

leftquark

We’re currently working on adding captions on top of the photo and in slideshows, and then have some iterations planned to the zooming. We’ll keep you informed.

blouie

leftquark, based on the posts up above, would you please tell me what the CSS code is (put all together from the different posts) for disabling the zoom cursor? This is imperative for me immediately. Otherwise, my site is severely hampered as I have had to turn off Lightbox completely, since I will not tolerate zooming on my images. Thank you.

Hikin' Mike

@blouie said:
I see there's CSS code mentioned for disabling the zoom, but it seems that it's modified in a later post.

Would someone please post the entire CSS code altogether.

There is NO way to disable the zoom feature, but you can change the zoom cursor to the default icon:

/* Replace the zoom-in cursor icon with the default icon */
.sm-position-relative > div {
    cursor: default !important;
}

Add this to your Theme's custom CSS section. If you don;t know how, there is a link in my signature below.

blouie

Thank you Hikin' Mike. But Jtring says we can turn the zoom function off completely. I'd just like to know all the CSS together (because I'm not clear what is the correct pasting together from bits of code in different posts).

Hikin' Mike

@blouie said:
Thank you Hikin' Mike. But Jtring says we can turn the zoom function off completely. I'd just like to know all the CSS together (because I'm not clear what is the correct pasting together from bits of code in different posts).

Reference my post above.

blouie

Below is how I pieced it together. It seems to work: It turns cursor back to arrow, and doesn't zoom (at least not on my 27" 2.5k display - maybe won't work when I look at smaller displays?).

But one small problem is that clicking causes the image to uselessly reload (but not zoomed). If I could just stop the image from reloading at all, so that clicking would do absolutely nothing.

/* Turn off the zoom if it would result in upscaling./
.sm-position-relative > div {
transform:scale(1)!important;
}
/ Replace the zoom-in cursor icon with the pointing hand icon*/
.sm-position-relative > div {
cursor:default !important;
}

blouie

P.S. It reloads the image. But if you X out back to the gallery, then go back to the image in Lightbox and click on it, it does not reload again. (It "remembers" that it had reloaded previously and doesn't do it again.)

Hikin' Mike

@blouie said:
Below is how I pieced it together. It seems to work: It turns cursor back to arrow, and doesn't zoom (at least not on my 27" 2.5k display - maybe won't work when I look at smaller displays?).

But one small problem is that clicking causes the image to uselessly reload (but not zoomed). If I could just stop the image from reloading at all, so that clicking would do absolutely nothing.

/* Turn off the zoom if it would result in upscaling./
.sm-position-relative > div {
transform:scale(1)!important;
}
/ Replace the zoom-in cursor icon with the pointing hand icon*/
.sm-position-relative > div {
cursor:default !important;
}

For some reason I didn't see his transform: scale(1) !important; originally. The code you posted is commenting out that. If I add the following on my site, it works on my site.

.sm-position-relative > div {
    transform: scale(1) !important;
    cursor: default !important;
}

blouie

For me, yours works the same as mine. And I still get the reload. Do you get the reload too?