Jump to content

How can I show gallery image information on first click, not hover?

Recommended Posts

Site URL: http://www.roqlarue.com/current-exhibition

I would like to make the details for a gallery image be shown when a user clicks the image from the main page, not making the user hover or click another link (on mobile) to see the details.

We get so many people who do not understand how to use this functionality and we need to hold their hand through it. Here is the current CSS I have on the page, but I don't know what to effect to make the action reversed.

Any tips would be very welcome! 😃

 

@media screen and (max-width:640px){ 
a.sqs-lightbox-meta-trigger {
    visibility: hidden;
    width: 100% !important;
}
a.sqs-lightbox-meta-trigger:before {
    background-color: #ffffff;
  color: #000000;  
  font-size: 30px;
  font-family: "Adobe Garamond Pro", Times New Roman, serif;
    font-style: none;
    font-weight: 400;
      text-transform: none;
    text-decoration: underline;
    border-radius: 0%;
    visibility: visible;
    content:"Details about this piece";
}

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.