Question

使用jQuery插件bgStretcher 2（link to plugin），我试图让一个页面上的各种<div>使用它的功能。但是，该插件似乎只支持每页一个实例，如果我进行多个$("#element").bgStretcher()调用，则只有第一个有效，其他所有被忽略，而且＃34;多个bgStretcher＆＃34;在控制台中记录。

有没有办法解决这个问题，或者是否有其他类似的插件，即智能地拉伸图像以填充元素？我试图破解这个插件的相关部分，但没有运气。

使用背景大小：100％不起作用，因为它不会垂直填充元素空间，它只是水平拉伸。

Answer 1

如果您的设计允许您一次只显示一个bgstretcher实例，则可以销毁活动实例并创建另一个实例。

$('#slide1').bgStretcher.sliderDestroy();

$('#slide2').bgStretcher({
    images: imagesArray,
    imageWidth: 1600,
    imageHeight: 800,
});

Answer 2

您是否尝试添加容器ID？

el1.bgStretcher({
                containerId: "bgstretcher1",
                images : [...],
                ... further settings ...
})
el1.bgStretcher({
                containerId: "bgstretcher2",
                images : [...],
                ... further settings ...
})

bgStretcher插件 - 多个实例

2 个答案: