Jump to content

SSPSNina

Member
  • Posts

    3
  • Joined

  • Last visited

SSPSNina's Achievements

  1. Thank you for getting back to me. I used this one for all the code blocks, only difference is the websites and image link. <a href="https://persistnashville.force.com/PersistNashville/s/persist-fund-request"> <div class="image-swap"> <img src="https://static1.squarespace.com/static/5d1b7aeaeedb4900012c21c3/t/62ec4e86eb732b0cd89c0bea/1659653766195/1.png"> <img src="https://static1.squarespace.com/static/5d1b7aeaeedb4900012c21c3/t/62ec4e8b3c1b510f4a8876fc/1659653771448/2.png"> And this is the custom CSS code I've put in. .image-swap img:nth-child(1) {position: absolute; transition: 0.2s} .image-swap img:nth-child(1):hover {opacity: 0}
  2. Site URL: https://www.persistnashville.org/student-resources-copy Hi, I was trying to create a clickable image that will change into another image when hovering over it. Because I have zero coding experience, I followed the tutorial posted by Carl Johnson on YT that achieved the exact effects I was going for. However, it's only working in editing mode (see picture attached). If you click on the actual url you'll see that everything, including the non-coding blocks have been squished to the left. I have redone every step in his video twice and the layout is still messed up. I haven't found a fix for this on the forum. Does anyone know how to fix this? Greatly appreciated!
×
×
  • 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.