Jump to content

Linking a image hover

Recommended Posts

Site URL: http://eqgrp.com/portfolio

On this page I have used the code to create a hover effect over the images. However I can get the link to work when they are clicked. Here is the code I am using

#collection-5f69f44101c29b17224c76fe{
  .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover:hover .image-caption-wrapper, .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover :focus+.image-caption-wrapper{
        height: 100%;
    max-height: 100%;
    background: rgba(3,75,110,70%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  }
  .sqs-block-image .image-block-outer-wrapper:not(.image-block-v2).layout-caption-overlay-hover .image-caption-wrapper p{
    color: #fff;
  }
 
  
}

 

Link to comment
  • Replies 3
  • Views 322
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

15 hours ago, derricksrandomviews said:

  I noticed there are no pointer events at all when hoving over a thumbnail. I think you meant to say you can't get the link to work when clicked. Is that so? Are the thumbnails supposed to take you to a gallery?

Yeah that’s right, they go to another website. What do you think I need to add?

Link to comment

Are the images in a gallery section? If so here are the instructions to add a url to each thumbnail:

To add clickthrough URLs to images in a gallery section:

  1. Add a page with a gallery section to your site, or click an existing page with a gallery section in your Pages panel.
  2. Click Edit on the page.
  3. Hover over the gallery section and click the image icon.
  4. Click the image where you want to add the clickthrough URL.
  5. In the Link field, enter a URL, or click the gear icon for more options

The easiest way is, one at a time obviously,  to go to each site the click thru for that image is supposed to go to, copy the address and paste it into the link field. If you wanted to go to my site, you need the whole address https://myrandomviews.com/

 

 

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.