Applying Hover Effect on Footer

Site URL: https://watermelon-goby-el8a.squarespace.com/

Hello I'm trying to change the color of my footer once I hover over the text. I am using the 'Kester' template and I have the CSS code set for the navigation bar; however, I can't seem to find a code for the footer.  

Thanks for your time,

Reece

Add to Design > Custom CSS

footer.sections a:hover {
    color: red;
}

Do you happen to know what the code for just the logo in the header is? Trying to implement a glitch on hover effect and can't seem to figure out how to do it properly and cant figure out the correct code for the logo in the header.

Thank you in advance,

Brianne Evelyn

brianne.alexis113@gmail.com

On 2/24/2021 at 1:00 PM, Brianne_113 said:

Do you happen to know what the code for just the logo in the header is? Trying to implement a glitch on hover effect and can't seem to figure out how to do it properly and cant figure out the correct code for the logo in the header.

Thank you in advance,

Brianne Evelyn

brianne.alexis113@gmail.com

Can you share your site url?

On 2/18/2021 at 9:31 PM, tuanphan said:

Add to Design > Custom CSS

footer.sections a:hover {
    color: red;
}

 

Hi, I've tried a bunch of permutations for changing hover state color on my site but nothing seems to work. The only code that I've gotten to work to do anything is the following:
 

//add footer hover state 

footer a:hover {

background: #BA5E41 !important;

}

Anything I've tried to change just the font color has failed. I'd even love to try something like what I have in the header which is a squishy line:

:after {

  content: '';

  background: #BA5E41; //color

  height: 1px; //thickness

  width: 0;

  display: block;

  margin-top: 1px !important;

  transition: width 1s; //animation speed

  margin: 0 auto;

}

That didn't work either. I'm striking out.

url: https://lychee-dogfish-zgem.squarespace.com/ (we will go live tonight so this may be a different url --> elcamino.travel)

pw: ezc

On 1/11/2022 at 1:06 AM, bybridges said:

 

Hi, I've tried a bunch of permutations for changing hover state color on my site but nothing seems to work. The only code that I've gotten to work to do anything is the following:
 

//add footer hover state 

footer a:hover {

background: #BA5E41 !important;

}

Anything I've tried to change just the font color has failed. I'd even love to try something like what I have in the header which is a squishy line:

:after {

  content: '';

  background: #BA5E41; //color

  height: 1px; //thickness

  width: 0;

  display: block;

  margin-top: 1px !important;

  transition: width 1s; //animation speed

  margin: 0 auto;

}

That didn't work either. I'm striking out.

 

url: https://lychee-dogfish-zgem.squarespace.com/ (we will go live tonight so this may be a different url --> elcamino.travel)

pw: ezc

You mean

Hover footer links >> change to another color?

Use this CSS

footer.sections .html-block a:hover span {
    color: #ba5e41 !important;
}

On 1/12/2022 at 2:41 AM, tuanphan said:

You mean

Hover footer links >> change to another color?

Use this CSS

footer.sections .html-block a:hover span {
    color: #ba5e41 !important;
}

 

Thank you!

hello, 

I would like to have an underline animation on the footer links, instead of a only color animation, Is this possible? 

Website: https://porpoise-rhino-pspb.squarespace.com/

password:1234 

Thank you! 

On 9/7/2024 at 2:31 AM, Barbi said:

hello, 

I would like to have an underline animation on the footer links, instead of a only color animation, Is this possible? 

Website: https://porpoise-rhino-pspb.squarespace.com/

password:1234 

 

Thank you! 

You can use this to Website Tools > Custom CSS

footer.sections .html-block a {
    border-bottom: 1px solid transparent;
}
footer.sections .html-block a:hover {
    border-bottom: 1px solid #fff;
}