Options

collage landscape always shows caption in Chrome (should float), OK Edge/IE11/FIrefox

denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
edited May 8, 2016 in Bug Reporting
Something happened - I think yesterday - to change the behavior of collage landscape galleries in Chrome.

I have my site set to show the captions in galleries set to collage landscape only when the viewer hovers over the image. (Odd though, I can't seem to find where I selected that options, if you can tell me where that would be awesome!).

Yesterday my collage landscape galleries looked fine in the three browsers I regularly use - Chrome, Firefox, and IE11.

Today my collage landscape galleries in Chrome always show the caption and the buy button. I like the addition of the buy button but I don't want the captions or the buy button to show by default in collage landscape style - the photos are too small to have a piece covered by the caption. I do want both caption and buy button to show on hover though.

Before you ask, yes, I cleared the browser cache and restarted Chrome, just in case...

Screen shot from Chrome:
i-JG7srGW-XL.jpg

Screen shot from IE11:
i-XcSvFW7-XL.jpg
In case you need a gallery example, here's a link to the gallery I used for the screen shots - http://www.denisegoldberg.com/Travel/Arizona-2013/Saguaro-and.

Please fix this - I only want the captions to show on hover.

--- Denise
«13

Comments

  • Options
    beardedgitbeardedgit Registered Users Posts: 854 Major grins
    edited December 24, 2013
    FWIW, I moaned earlier about that cart icon upsetting my text-formatting - see http://dgrin.com/showthread.php?t=243920

    I've got Shopping turned off, but I still get the icon, for me it has the "Owner Buy" properties, and the hover action in Chrome is not changed (it's set to "show on hover"). Furthermore, I see your site fine - text & cart only on hover.

    Nice of SM to tell us what's going to happen, eh?
    Yippee ki-yay, footer-muckers!
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 24, 2013
    beardedgit wrote: »
    FWIW, I moaned earlier about that cart icon upsetting my text-formatting - see http://dgrin.com/showthread.php?t=243920

    I've got Shopping turned off, but I still get the icon, for me it has the "Owner Buy" properties.

    Nice of SM to tell us what's going to happen, eh?
    Yes, but this isn't a complaint about the cart icon - it's about the caption + cart automatically showing in Chrome. The behavior is as expected in the other browsers.

    I actually like the addition of the cart icon on hover.

    --- Denise
  • Options
    beardedgitbeardedgit Registered Users Posts: 854 Major grins
    edited December 24, 2013
    Yes, but this isn't a complaint about the cart icon - it's about the caption + cart automatically showing in Chrome. The behavior is as expected in the other browsers.

    I actually like the addition of the cart icon on hover.

    --- Denise
    Sorry, I posted before I'd finished typing, I wanted it to say that from here I see your site fine in Chrome, no carts or text unless hovering. Previous post edited to say such.
    Yippee ki-yay, footer-muckers!
  • Options
    zacHer0zacHer0 Registered Users Posts: 655 Major grins
    edited December 24, 2013
    Owner Buy only shows up to you while logged in. Owner Buy will always be there, even if you have the shopping cart turned off in the gallery settings.
    Zac Williams
    Support Hero
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 24, 2013
    zacHer0 wrote: »
    Owner Buy only shows up to you while logged in. Owner Buy will always be there, even if you have the shopping cart turned off in the gallery settings.
    This thread isn't about the owner buy showing up - it's about the captions showing all of the time in collage landscape galleries in Chrome.
    I expect to see owner buy if I'm logged in!

    But - interestingly enough I just tried on my work computer:
    > work computer, Windows 7, Chrome 31.0.1650.63 m looks OK
    > home computer, Windows 8.1, Chrome 31.0.1650.63 m always shows the caption

    Any ideas about the cause of this behavior?

    --- Denise
  • Options
    zacHer0zacHer0 Registered Users Posts: 655 Major grins
    edited December 24, 2013
    Sorry Denise, I meant to post that in Bearded's thread, not yours.
    Zac Williams
    Support Hero
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 24, 2013
    zacHer0 wrote: »
    Sorry Denise, I meant to post that in Bearded's thread, not yours.
    No problem Zac!

    I find it odd and somewhat interesting that the behavior I'm seeing seems to only occur on one computer so far...

    --- Denise
  • Options
    zacHer0zacHer0 Registered Users Posts: 655 Major grins
    edited December 24, 2013
    Just tried your gallery logged out in Chrome/FF/Safari and the captions only show up when hovering over the image.

    Have you tried clearing cache/cookies in that Chrome browser?
    ne_nau.gif
    Zac Williams
    Support Hero
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 24, 2013
    zacHer0 wrote: »
    Just tried your gallery logged out in Chrome/FF/Safari and the captions only show up when hovering over the image.

    Have you tried clearing cache/cookies in that Chrome browser?
    Yes, and I just tried it again. Cleared cache and cookies, closed browser, reopened.

    I can reproduce the problem with the latest version of Chrome on Windows 8.1.
    I can't reproduce the problem with the latest version of Chrome on Windows 7.

    Unfortunately my second Windows 8.1 computer is a Surface and there isn't a version of the Chrome browser that runs in that environment.

    Do you have a windows 8.1 system where you can check?

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited January 3, 2014
    bump for status from smug.

    This problem only occurs on Chrome on Windows 8.1.
    Please fix it - collage galleries look terrible with the caption showing.

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited January 5, 2014
    bump for status from smug.

    Windows 8.1 is on a lot of computers - this needs fixing.

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited January 7, 2014
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited January 19, 2014
    Any chance of getting this fixed???

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited February 21, 2014
    I really don't want a band of white on top of my photos in collage landscape style. I know, I know, it's only broken in Chrome - but it looks terrible.

    Can we get this fixed?

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited March 15, 2014
    Bump for status from SmugMug
    I know, I know, the problem only occurs on Chrome, and only on Windows 8.1 (maybe Windows 8 too, I can't check...).
    Can we please get this fixed?

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited April 9, 2014
    BUMP FOR STATUS

    I'm having a really hard time believing that I'm the only person who sees this problem. Yes, I know, it only happens in Chrome in Windows 8 - but given that is the operating system that is on new (Windows) computers these days, why is it that you (smug) don't seem to care about it?

    I looked at a site in the "Show us your new smugmug..." thread yesterday and was shocked to see captions on the images on the home page. Then I realized it was because of this defect.

    Can we please get this fixed?

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited April 20, 2014
    BUMP FOR STATUS

    I guess no one cares that our sites look bad in Chrome in Windows 8.1????

    --- Denise
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 17, 2014
    at least now I know it's not just me, reported by jkinglet as well in the thread Win8.1, Chrome and Collage Landscape Captions.

    Again, I only see this behavior in Chrome on Windows 8.1.

    This defect degrades the look of galleries - a transparent bar showing across all photos is not desired.

    I'd appreciate a status and more importantly a fix.

    --- Denise
  • Options
    leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited December 20, 2014
    Hi Denise,
    My apologies for ignoring the DGrin forums for the last few days. I saw jkinglet's post and will try to get the Support Heroes to pull up a windows 8.1 version of Chrome to see if we can re-create the issue. I don't have a Virtual Machine on this machine and can't load it up myself :(. Since it appears to only effect Chrome on Windows 8.1, I'd imagine it's something to do with Chrome and not with SmugMug but I don't want to place all the blame there before I can actively look into it on our own. Even if it is, there may be something we can do. I'll get back to you on this soon.

    In the future feel free to shoot me a private message and point me to the bug threads. I usually login to dgrin every day and the PM will trigger a notification. In the mean time, I've also set the Bug Reporting thread to send me emails every time there's a new post. That should help so I don't end up missing these.
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • Options
    leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited December 20, 2014
    Denise,
    If you right click on the caption overlay area and "Inspect Element", then click on the div: "<div class="sm-tile-info">" does it have the following:
    .sm-tiles-infohover-show .sm-tile-info {
    opacity: 0;
    }
    

    One of the support heroes confirmed he has the same issue on his site using Windows 8.1/Chrome and he said he couldn't find the above code anywhere.

    Update: One of the Customizers and I spent an hour now trying to dig deeper into this. The same code that we add and works on a Mac won't work on Windows 8.1/Chrome. We've been able to successfully hide the caption overlay but we can't get it to show back up on hover. It appears Chrome is having some kind of issue with the hover action. We tried using opacity, visibility, and display code all to no avail. I'll pick up tomorrow and bring it up with a few other folks.
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 20, 2014
    leftquark wrote: »
    In the future feel free to shoot me a private message and point me to the bug threads. I usually login to dgrin every day and the PM will trigger a notification. In the mean time, I've also set the Bug Reporting thread to send me emails every time there's a new post. That should help so I don't end up missing these.
    Thank you!
    leftquark wrote: »
    Denise,
    If you right click on the caption overlay area and "Inspect Element", then click on the div: "<div class="sm-tile-info">" does it have the following:
    .sm-tiles-infohover-show .sm-tile-info {
    opacity: 0;
    }
    

    One of the support heroes confirmed he has the same issue on his site using Windows 8.1/Chrome and he said he couldn't find the above code anywhere.

    Update: One of the Customizers and I spent an hour now trying to dig deeper into this. The same code that we add and works on a Mac won't work on Windows 8.1/Chrome. We've been able to successfully hide the caption overlay but we can't get it to show back up on hover. It appears Chrome is having some kind of issue with the hover action. We tried using opacity, visibility, and display code all to no avail. I'll pick up tomorrow and bring it up with a few other folks.
    I don't see that code either.

    --- Denise
  • Options
    leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited December 20, 2014
    Denise,
    Couple follow up questions: has it always been like this or did it start doing this recently? Also, are you using a full desktop computer or is it a tablet/laptop combo device like a Surface?

    We haven't pushed anything live in the last few days that would have changed this behavior so I'm trying to understand where it started, or if it's always behaved this way. We do have some control over touch devices -- we disable the hover behavior since touch devices with no mouse have no hover capability. Devices like the Surface which are a hybrid can be tricky.
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 20, 2014
    leftquark wrote: »
    Denise,
    Couple follow up questions: has it always been like this or did it start doing this recently? Also, are you using a full desktop computer or is it a tablet/laptop combo device like a Surface?

    We haven't pushed anything live in the last few days that would have changed this behavior so I'm trying to understand where it started, or if it's always behaved this way. We do have some control over touch devices -- we disable the hover behavior since touch devices with no mouse have no hover capability. Devices like the Surface which are a hybrid can be tricky.
    This started in December of 2013 (date on the first post in this thread is 12/23/2013).

    This is on a full desktop computer running Windows 8.1. Well, I'm not sure if you would really call it a desktop - it's an all-in-one with a large screen. I believe the guts are equivalent to a laptop. The computer does have a touch screen - but I use a mouse with it.

    I have been using this computer since sometime early in 2013, can't remember when I upgraded it to Windows 8.1. I just checked the release date - Windows 8.1 was released for general availability on October 17, 2013. I'm sure I upgraded as soon as it was available so I don't believe the operating system is causing the problem. It's quite suspicious given that I don't see the problem on any other operating system - but again I'm sure I was running 8.1 without this problem prior to 12/23/2013.

    It seems very odd that IE and Firefox both behave properly; Chrome doesn't.
    I guess the other question to ask is if something changed on Chrome around the date that this problem started. I'm not sure how to track that...

    I don't have access to any other computer running Windows 8 other than my Surface. That is the Surface 2, not the Pro, so the only browser I have available on that device is IE. And IE doesn't have this problem.

    --- Denise
  • Options
    leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited December 20, 2014
    If you load up this page, do the items under iPhone touch/gesture events show up as "true"? http://kangax.github.io/iseventsupported/

    How about in IE/Firefox?
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 21, 2014
    leftquark wrote: »
    If you load up this page, do the items under iPhone touch/gesture events show up as "true"? http://kangax.github.io/iseventsupported/

    How about in IE/Firefox?
    On Chrome:
    TRUE: touchstart, touchend, touchmove, touchcancel
    FALSE: gesturestart, gesturechange, gestureend

    On IE and Firefox:
    all entries are FALSE

    --- Denise
  • Options
    leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited December 21, 2014
    On Chrome:
    TRUE: touchstart, touchend, touchmove, touchcancel
    FALSE: gesturestart, gesturechange, gestureend

    On IE and Firefox:
    all entries are FALSE

    That will explain why it's working the way it is. Chrome is reporting that it's a touch device, just because it could potentially be one, if you were using it as a touch screen, when in fact you have a mouse attached. The browser doesn't give us any indication that a mouse is attached, only that you're using a touch capable device. If you are on a touch capable device, we want to show the title/caption by default because there'd be no other way to get it to display (no mouse hover), so that's why it's working how it is. I'm not sure why Chrome for Windows 8.1 works this way but everyone else is OK. From what I've read it's actually a bug in IE that it doesn't report it's touch capable but that works out for our benefit!

    I'm going to try to throw together some CSS code that gets around this but it most likely will mean there's some use case (if you took the mouse off and were using it as a touch device) that wouldn't ever see captions overlays.
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 21, 2014
    leftquark wrote: »
    That will explain why it's working the way it is. Chrome is reporting that it's a touch device, just because it could potentially be one, if you were using it as a touch screen, when in fact you have a mouse attached. The browser doesn't give us any indication that a mouse is attached, only that you're using a touch capable device. If you are on a touch capable device, we want to show the title/caption by default because there'd be no other way to get it to display (no mouse hover), so that's why it's working how it is. I'm not sure why Chrome for Windows 8.1 works this way but everyone else is OK. From what I've read it's actually a bug in IE that it doesn't report it's touch capable but that works out for our benefit!

    I'm going to try to throw together some CSS code that gets around this but it most likely will mean there's some use case (if you took the mouse off and were using it as a touch device) that wouldn't ever see captions overlays.
    Thanks! I'll be happy to add CSS code to remove this issue.

    I think I would prefer no caption overlays in that case anyway - the captions are visible from lightbox and I think that is OK. It's preferable to not have the overlay always showing on the images; in my opinion that behavior makes the gallery style look a bit clunky.

    I still find it very interesting that this worked properly on Windows 8.1 and Chrome prior to the day I reported the problem.
    --- Denise
  • Options
    leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited December 21, 2014
    It's preferable to not have the overlay always showing on the images; in my opinion that behavior makes the gallery style look a bit clunky.

    I agree. In fact, I was talking to one of the Engineer's about potentially changing it that way for everyone so you wouldn't need to use the custom CSS i'm going to cook up but we'll have to decide if that's the route we want to go, or just let those of you add CSS to fix it. With it being the holidays the quickest fix is most likely going to be some Custom CSS. I'm trying to get a Windows 8.1 Virtual Machine installed so I can try to tackle it.
    I still find it very interesting that this worked properly on Windows 8.1 and Chrome prior to the day I reported the problem.

    It's either 1 of 2 things: Chrome updated itself to try to address Windows 8.1's Hybrid Tablet/PC thing and as of that date set itself to be report being a touch device even if it's not ... or we added code to detect that it's a touch device. My guess is that it's the first but I don't want to push the blame off without actually knowing :)
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
  • Options
    denisegoldbergdenisegoldberg Administrators Posts: 14,268 moderator
    edited December 21, 2014
    leftquark wrote: »
    I agree. In fact, I was talking to one of the Engineer's about potentially changing it that way for everyone so you wouldn't need to use the custom CSS i'm going to cook up but we'll have to decide if that's the route we want to go, or just let those of you add CSS to fix it. With it being the holidays the quickest fix is most likely going to be some Custom CSS. I'm trying to get a Windows 8.1 Virtual Machine installed so I can try to tackle it.
    I'm happy to add some code to my site to fix this (although my preference would be not to need code). Problem is, I can fix it for my site but I still need to look at the overlays on anyone else's site where the collage style galleries are used.

    Most important to me though - this means that I will be able to prevent someone else from seeing my site in this messy mode.

    Thanks for your help!

    --- Denise
  • Options
    leftquarkleftquark Registered Users, Retired Mod Posts: 3,784 Many Grins
    edited December 23, 2014
    Ok, so let me first off and apologize because this is going to get a bit messier than I'd normally like. I installed windows 8.1 on my machine and pulled up Chrome but because my machine doesn't have a touch interface, Chrome properly reports that there's no touch elements and I cant imitate your problem. I need to find someone with a Surface. In the mean time, I'm going to try to offer some code and see if it works. Tomacz tried to write some but had trouble so I'm not sure if any of it will work. If you're ok bearing with me while we go back and forth with some attempts, hopefully we can find something that works.

    First, try this:
    /* Hide the title / caption bar by default */
    .sm-tile-info {
      display: none !important;
    }
    
    /* On hover, display the title / caption bar */
    .sm-tile:hover .sm-tile-info {
      display: block !important;
    }
    

    If that works, lets limit it only to big screens so that it still displays the captions on tablets/smartphones:
    @media only screen and (min-width: 1024px) {
      /* Hide the title / caption bar by default */
      .sm-tile-info {
        display: none !important;
      }
    
      /* On hover, display the title / caption bar */
      .sm-tile:hover .sm-tile-info {
        display: block !important;
      }
    }
    
    dGrin Afficionado
    Former SmugMug Product Team
    aaron AT aaronmphotography DOT com
    Website: http://www.aaronmphotography.com
    My SmugMug CSS Customizations website: http://www.aaronmphotography.com/Customizations
Sign In or Register to comment.