Jump to content

EliasFinkbeiner

Member
  • Posts

    4
  • Joined

  • Last visited

EliasFinkbeiner's Achievements

Level 2

Level 2 (2/20)

0

Reputation

  1. Sure, the link is https://aardvark-disc-4bm8.squarespace.com/home; the password is "rise1234". I am talking about the very last section on that page. Thanks in advance!
  2. Thank you, I think maybe I made a mistake when writing the question. You're right, but this only applies to the gallery slideshow; I am using a carousel (.user-items-list-carousel). I don't see an option there to change the animation...
  3. I think the question is pretty self-explanatory, I have a carousel slideshow on my website and I want it to immediately switch to the next slide without "sliding" over to it. Or is there any better way to do this?
  4. I have placed 4 icons over an image which increase in scale when hovering and clicking on them. Now, I also want them to trigger a text that appears when clicking one of them individually. I tried to solve this with a slideshow below the main image using .slide:nth-child(1) to target the specific slide when hovering. This is the code that I've been using: #block-yui_3_17_2_1_1678741246285_2451, #block-yui_3_17_2_1_1678741246285_11495, #block-yui_3_17_2_1_1678741246285_21876, #block-aadbebd280ba4624dfc7 { cursor: pointer; } #block-yui_3_17_2_1_1678741246285_2451:hover, #block-yui_3_17_2_1_1678741246285_11495:hover, #block-yui_3_17_2_1_1678741246285_21876:hover, #block-aadbebd280ba4624dfc7:hover { opacity: 0.8; } #block-yui_3_17_2_1_1678741246285_2451:hover ~ section[data-section-id="640fab92daa07174cc2c48c2"] .slide:nth-child(1), #block-yui_3_17_2_1_1678741246285_11495:hover ~ section[data-section-id="640fab92daa07174cc2c48c2"] .slide:nth-child(2), #block-yui_3_17_2_1_1678741246285_21876:hover ~ section[data-section-id="640fab92daa07174cc2c48c2"] .slide:nth-child(3), #block-aadbebd280ba4624dfc7:hover ~ section[data-section-id="640fab92daa07174cc2c48c2"] .slide:nth-child(4) { opacity: 1; transform: translateX(0); transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; } section[data-section-id="640fab92daa07174cc2c48c2"] .slide { opacity: 0; transform: translateX(-50px); transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out; } It would be incredible if someone could help me out here or give me any ideas for a better way to solve this. The password for the website is "rise1234".
×
×
  • 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.