Please help with link higlighting

  • Resolved speedyp20

    (@speedyp20)


    10 years, 8 months ago

    Spent a couple of hours trying to work this out but really need help.

    Before the scroll-to plugin, I styled my navigation for hovered links like this:

    .nav-bottom .art-nav ul.art-hmenu > li > a.active {
background:white !important;
color:#ED7006 !important;
border-bottom:1px solid orange;
}

    When I inspect an active link I can see the various extra classes:
    _mPS2id-h mPS2id-highlight mPS2id-clicked mPS2id-highlight-last

    Could someone please help me edit my original code to include the scroll-to markup? Everything else is working beautifully!
    Thanks

    https://ww.wp.xz.cn/plugins/page-scroll-to-id/

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author malihu

    (@malihu)

    10 years, 8 months ago

    Without knowing your menu markup or what exactly you want to do, I’d suggest the following:

    1
    Remove the !important part from the CSS rules you posted (I don’t know if/why you need it): 

    .nav-bottom .art-nav ul.art-hmenu > li > a.active {
  background: white;
  color: #ED7006;
  border-bottom: 1px solid orange;
}

    2
    (Re)set the non-active styling for the menu links that are handled by ‘Page scroll to id’: 

    .nav-bottom .art-nav ul.art-hmenu > li > a._mPS2id-h {
  background: /* your standard non-active color */;
  color: /* your standard non-active color */;
  border-bottom: /* your standard non-active border style */;
}

    3
    Highlight page-scroll-to-id menu links: 

    .nav-bottom .art-nav ul.art-hmenu > li > a._mPS2id-h.mPS2id-highlight {
  background: white;
  color: #ED7006;
  border-bottom: 1px solid orange;
}

    I’m not sure if the above will do what you need (I’m going blind/just guessing here) but you can try.

    Thread Starter speedyp20

    (@speedyp20)

    10 years, 8 months ago

    THANKYOU so much! That was exactly the help I needed.

    Amazing plugin & backup 🙂

    Plugin Author malihu

    (@malihu)

    10 years, 8 months ago

    You’re welcome!
    Thanks for the comments 🙂

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Please help with link higlighting’ is closed to new replies.