Jump to content

Image Swap on Hoverstate

Recommended Posts

Site URL: https://www.mc3.com/

I'm trying to achieve the same image swap as this site on my website's team page.

Our team page is currently built with 1x4 image content blocks. Using the same process and code as this tutorial, I was able to mess around enough to create this.

When I'm logged in, it works and looks as intended - see here.
But when not logged in, they lose their padding and the 2nd image shrinks, regardless of both being sized at 300x200. See here, live.

Two questions:
- Any work arounds for this padding and shrinkage (insert Seinfeld quote) issue?
- Is there a better way, in general, to do this for 50+ employee images? (100+ respectively)

Link to comment
  • Replies 1
  • Views 276
  • Created
  • Last Reply

Do you still need help on this?

I used to code for a client.
Our solution adds a Gallery to the bottom of the page (it's visible only in editing mode, not visible to visitors).
Then use JavaScript to connect team members with photos in Gallery in the correct order. When you add a new member, just add a photo to Gallery. The Hover image will work.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment


This topic is now archived and is closed to further replies.

  • 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.