jquery - 如何以编程方式旋转使用背景大小 :cover with Jquery? 的 div 的背景图像

Question

我试过这个来更改网站的背景图片，但不幸的是它不起作用。可悲的是，控制台没有给我任何关于问题的线索。所以我已经没有想法了。希望有人能帮忙。我想做的是根据图像数组旋转网站背景上的图像。我不知道为什么它不起作用(也许背景的 cover 属性妨碍了？)。我已经花了好几个小时来解决这个问题并更改代码以便它可以工作。首先，我没有使用 new Image() 构造函数填充数组，然后我认为应该修复它，否则浏览器可能没有可使用的 dom 节点。但我还是卡住了。 (大部分代码都是基于这个网站上的答案，here 这是代码:

$(document).ready(function() {
fondos = new Array('/Foto_Pimend/activos/flickr_foto_fondo_1.jpg',     '/Foto_Pimend/activos/flickr_foto_fondo_2.jpg',     '/Foto_Pimend/activos/flickr_foto_fondo_3.jpg');
cargar_fondos=new Array();
fondo_num = 1;
var i;
for(i=0; i<fondos.length; i++) {
cargar_fondos[i]=new Image();
cargar_fondos[i].src=fondos[i]; 
}
function rotarFondos() {
$('.fondo_intro').css({'background':'url("'+cargar_fondos[fondo_num++     %cargar_fondos.length].src+'") no-repeat 50% 100% cover'},'slow');
}
intId=setTimeout(rotarFondos, 10000);
});

我试图以编程方式更改的 div 具有以下样式:

.fondo_intro {background: url(/Foto_Pimend/activos/flickr_foto_fondo_1.jpg) no-repeat;     width:100%; background-size:cover; background-position:50% 100%;position:fixed;     height:100%;}

我还尝试将该函数链接到我用来更改内容的点击事件，如下所示:

$('.link_manejador').click(function() {
var content = $(this).attr('name')+'_template';
llamada_contenido(content); rotarFondos();  
});

这样我就可以根据内容改变背景，而不是旋转背景。 但它也不起作用，更令人沮丧的是，控制台没有显示任何错误或提示正在发生的事情。我可以看到正在创建的图像和计数器(即 fondo_num)递增，但没有任何反应。更重要的是:当我在控制台上发出时:

$('.fondo_intro').css({'background-  image':'url(/Foto_Pimend/activos/flickr_foto_fondo_2.jpg'},'slow')

没有任何反应。所以我不明白什么，非常清楚。

Answer 1

从这行代码中删除“cover”:

$('.fondo_intro').css({'background':'url("'+cargar_fondos[fondo_num++ %cargar_fondos.length].src+'") 不重复 50% 100% 覆盖'},'慢');