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; 
}