Clever Geek Handbook

Using .css () for pseudo-elements with jQuery

var navIcon1 = $('.nav-toggle span, .nav-toggle span:before, .nav-toggle span:after');

if (iconPos >= audPos && iconPos < eventPos) {
  navIcon.css('color', 'black');
  navIcon1.css('color', 'black');

}

I am trying to change the boot color. I tried this code but it doesn't work for me.
Can I change the CSS of the pseudo-elements using jQuery?

+3


source to share


2 answers


Instead of adding css to the if, add a class in "nav-toggle" for the given position and add your own color for this class



+5


source


Only one of the elements that you can change with this method .nav-toggle span

, you can do:

if (iconPos >= audPos && iconPos < eventPos) {
  $(".nav-toggle span").css('color', 'black');
}


As for the others: :before

, :after

etc. pseudo elements

- jQuery cannot access them the way you are trying to.

Adding a class containing your preferred color to the elements you want to change will be the way to achieve what you want to achieve.

+2


source






More articles:


All Articles