Почему не работает скрипт jQuery?

Question

[ekzotika]

Почему не работает скрипт jQuery?
Пытаюсь сделать, чтобы при скроллировании цвет header менялся на другой. Но ничего не происходит, совсем. Даже console.log не работает. Подозреваю, что проблема именно в том, что это jQuery. Подскажите, что здесь не так?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
        var menu = $("header");
          $(window).scroll(function() {
            var top = $(this).scrollTop();
            if ( top >= 100 ) {
              menu.css(background:'green');
            } else if ( top <= 200 ) {
              menu.css(background:'red');
            }
          });
    </script>

Answer 1

[Pashok Doom]

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"> </script>
<script>
  var menu = $("header");
  $(window).scroll(function() {
    var top = $('html').scrollTop();
    if (top >= 100) {
      menu.css('background','green');
    } else if ( top <= 200 ) {
      menu.css('background','red');
    }
  });
</script>

Comments

[ekzotika]

Спасибо большое за помощь!

Answer 2

[Игорь]

var menu = $("header");
$(document).on('scroll', function() {
  var top = $(this).scrollTop();
  if ( top >= 100 ) {
    menu.css({'background':'green'});
  } else if ( top <= 200 ) {
    menu.css({'background':'red'});
  }
});

так должно работать

Answer 3

[Евгений]

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
$(function () {
    var menu = $("header");
    $(window).scroll(function () {
        var top = $(this).scrollTop();
        if (top >= 100) {
            menu.css('background', 'green');
        } else if (top <= 200) {
            menu.css('background', 'red');
        }
    });
});