Sticky Header - Animation And Font Color - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!
Back to the questions

Sticky Header - Animation And Font Color

S

Stefan

Helix Framework 4 years ago

Hi, is it possible to add a small animation to the header when it will become sticky header? I want to remove the background for the normal header and add a black one when it becomes sticky. But with a small fade animation. Any idea on this?

Also I want to have a different font color for the header / sticky header.

0
4 Answers
Order by
Oldest Newest Votes
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 4 years ago #19328

Hi,

Would you please share your site URL, here?

Best Regards

0
S
Stefan
Accepted Answer
4 years ago #19330

please see hidden content

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 4 years ago #19377

Hi Stefan,

Here is the required code for your custom.css file:

#sp-header.header-sticky {
    animation: fadeInDown 1s;
    background: black;
}

Hope this will give you your desired sticky header.

Best Regards

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 4 years ago #19378

Code for different font color for your menu items, while header is sticky:

#sp-header.header-sticky .sp-megamenu-parent > li > a{
  color:red;
}

You can use your own color instead.

Thanks

0