我无法让.animate（）去工作

Question

Link: https://jsfiddle.net/nbonne/9hcoy9j8/

I aim is to have the medium blue box and everything in it move up when the search button is pressed.

I know my selector is for "form" and it's trying to change the background, I'm having trouble getting anything to animate.

I think this is the correct way to accomplish it but nothing happens:

$("#search-btn").click(function{
    $("controls-main").animate({
        background: "red"
    }, 500);
})

Answer 1

jQuery on its own can't animate colors. You need another library like jQuery UI. See this SO answer for more information.

Answer 2

In the fiddle:

1. Second click handler was missing parentheses (syntax error in console)
2. s-form class was missing from your form html code (empty selector)
3. $('search') is a wrong selector. You probably wanted $('[name=search]');
4. You are animating background, which jQuery's animate doesn't animate.

Updated working fiddle: https://jsfiddle.net/9hcoy9j8/18/

$(document).ready(function() {
  $(".rand-wiki").click(function() {
    window.open("https://en.wikipedia.org/wiki/Special:Random");
  });
  $(".s-form").on('click', function () {
    $("[name=search]").animate({
      marginTop: '40px'
    }, 500);
  });
});