Jump to content

abou

Member
  • Posts

    4
  • Joined

  • Last visited

abou's Achievements

Level 1

Level 1 (1/20)

0

Reputation

  1. The following code used to work on my website before but after changing the media some of the other non-related code was using they stopped working, even after going back a few steps they just did not want to work again. It is the zoom effect for the first background image and the zoom effect for the 2 image buttons below it on the home page. Here is the code that stopped working, any help is appreciated. // Image zoom effect // .sqs-block-image.design-layout-inline:hover img {transform: scale(1.2); transition: 1s } // Zoom In Hover Background Image // section[data-section-id="640ff1ec9bea1872c0bc0939"] .section-background img { transform: scale(2) !important; transition: all ease-in-out 1.5s !important; } section[data-section-id="640ff1ec9bea1872c0bc0939"]:hover .section-background img { transform: scale(1.2) !important; transition: all ease-in-out 1.5s !important; }
  2. https://www.abouhashish.co/ it's the bottom of the home page, the hats, hoodies, sweaters
  3. Is there any way to change this to work for Gallery sections? This is the current code I have, I am new to this and tried applying the code previously given in the forum to the gallery blocks but couldn't figure it out. Website is http://abouhashish.co .gallery-grid .gallery-caption { position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.4); height: 100%; padding: 0; opacity: 0; } .gallery-grid .gallery-caption-wrapper { display: flex; align-items: center; justify-content: center; } .gallery-grid .gallery-caption-content { font-size: 7rem !important; color: white; padding: 1vw; } .gallery-grid-item { position: relative; } .gallery-grid-item:hover .gallery-caption { opacity: 1; transition: 0.1s } .gallery-caption-grid-masonry { max-width: unset; } @media only screen and (max-width: 640px) { .gallery-grid .gallery-caption-content:not(.grid-gallery-v2).layout-caption-overlay-hover gallery-caption-content { opacity: 1 !important; visibility: visible !important; position: relative !important; } }
×
×
  • 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.