jQuery的动画

Question

有了这个代码如何将背景图片，也没有像在background.What未来是错这里的动画功能？Codepen Link。就是有一个按钮把不同的图像背景中的方法点击功能。

var colors=["http://publicdomainarchive.com/wp-content/uploads/2016/01/public-domain-images-free-stock-photos-002-1000x667.jpg","https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcSCJmPmIMiKQPy0M68oDKYuzoQT6pT4kL37vH8DzS3z36fYgza0"]; 
$(document).ready(function(){ 
    $("button").on("click",function(){ 
     getQuote(); 
}); 
}); 

function getQuote(){ 
     var color=Math.floor(Math.random()*colors.length); 
    $("html body").animate({ 
     backgroundImage:colors[color], 
     color:colors[color] 
    },1000);  
    } 

Answer 1

首先，你不能动画backgroundImage属性与jQuery的.animate()方法，第二的backgroundImage属性应该是：

backgroundImage: 'url(/path/to/image.jpg)'

如果你需要一个新的背景图像与每次点击，然后保持URL的另一个数组使用方法：

var colors = ["#16a085", "#27ae60", "#2c3e50"]; 
var images = ["image-1", "image-2", "image-3"]; 

var color = Math.floor(Math.random()*colors.length); 
var image = Math.floor(Math.random()*images.length); 


$("body").css({ 
    backgroundImage: "url("+images[image]+")", 
    color: colors[color] 
}); 

jQuery的不支持在不使用jQuery UI的情况下使用颜色。 ？

.message, .author { 
    transition: color 1000ms ease 0ms; 
}