我可以为背景渐变的变化设置动画吗？

Question

我正在尝试将渐变淡入作为背景色。

$('body').animate({
  background: '-webkit-gradient(linear,left top,left bottom,from(#b0c4ff),to(#6289ff)) fixed)'
}, 2000, function(){});

http://jsfiddle.net/myLf9o0j/3/

jQuery animate backgroundColor

Animation in css with gradient colors

Answer 1

创建一个完整的页面div并将其添加到所有其他元素后面的背景上。 然后你可以让它变得有生命力。

检查以下代码：

function goodMorning(){
	$('#background').animate({
            opacity: 1
	}, 2000);
}

goodMorning();

body{
    background-color: red;
}
#background{
    opacity: 0;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: -1;
    background: -webkit-gradient(linear,left top,left bottom,from(#b0c4ff),to(#6289ff)) fixed;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="background"></div>
<p>Hello :)</p>