Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Hover effects for navigation links


Blackbearsfire

Question

Can someone post the css code to add the hover effects into the navigation links like changing color or opacity?

This used to be easy to accomplish on version 7 in templates but I don't know how to code it into my site on 7.1

Link to post
  • Answers 3
  • Created
  • Last Reply

Top Posters For This Question

3 answers to this question

Recommended Posts

  • 0

Add to Design > custom CSS

/* nav hover */
.header-nav-item>a:hover {
    color: red !important;
}
.header-nav-folder-item:hover a {
    color: red !important;
}

 

Link to post
  • 0

Hi Tuanphan

The custom CSS works well. Thank you, solved one of my issues. How do you make text additionally bold on hover in CSS?

Kind regards,
Sibylle

 

Link to post
  • 0
On 4/18/2021 at 1:54 AM, Sibylle said:

Hi Tuanphan

The custom CSS works well. Thank you, solved one of my issues. How do you make text additionally bold on hover in CSS?

Kind regards,
Sibylle

 

Use this

/* nav hover */
.header-nav-item>a:hover {
    color: red !important;
	font-weight: bold !important;
}
.header-nav-folder-item:hover a {
    color: red !important;
	font-weight: bold !important;
}

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...