Как сделать добавление и удаление классов?

Question

[Арман Дендибаев]

(function($) {
   /*----------------------------------------------------*/
	/* Adjust Primary Navigation Background Opacity
	------------------------------------------------------*/
   $(window).on('scroll', function() {

		if($(window).scrollTop() >= 100) {  
            addClass('head-scroll');
         } 
         else {
            removeClass('head-scroll');
         }   
	});

я вот такой код написал -> при скролле на +100 должно добавится к header head-scroll
То есть до скролла<div class="header">
а при скролле на 100 <div class="header head-scroll">
а при возврате на исходное место удаляется head-scroll

Answer 1

[Сергей delphinpro]

var $header = $('.header');
var $win = $(window);
$win.on('scroll', function() {
    $header.toggleClass('head-scroll', $win.scrollTop() >= 100);
});

Comments

[Арман Дендибаев]

Что-то не работает

[Сергей delphinpro]

Арман Дендибаев, Работает https://jsfiddle.net/r3vgmu2u/

[Арман Дендибаев]

Сергей, Оо Спасибо бро ))

Answer 2

[Роман]

Если jq используется только для этого, то можно вот так на чистом js:

window.onscroll = function() {
      let scrolled = window.pageYOffset || document.documentElement.scrollTop;
      (scrolled >= 100) ? document.querySelector('.header').classList.add('head-scroll') :
                          document.querySelector('.header').classList.remove('head-scroll');
    }

...и не тянуть всю библиотеку.

Answer 3

[Vitaliy Vitaliy]

Есть как бы addClass и removeClass