javascript - 当横幅图片存储在javascript中时，如何在媒体查询中向首页横幅添加不同大小的同一图片？

这是我的横幅图片存储在javascript中的位置：

```

/*
    Background slideshow
*/
$('.top-content').backstretch("assets/img/backgrounds/Banner_1024 x 768.jpg");
$('.testimonials-container').backstretch("assets/img/backgrounds/testimonial1.jpg");

$('a[data-toggle="tab"]').on('shown.bs.tab', function(){
$('.testimonials-container').backstretch("resize");
});

```

我想为移动和其他屏幕尺寸添加横幅广告图像的另一个版本。我可以在这里的javascript中添加它们吗？如何链接媒体查询中的所有内容？

最佳答案

您正在使用jQuery插件Backstretch。

快速浏览https://github.com/jquery-backstretch/jquery-backstretch上的文档，可以发现这是一个内置功能。只需传递图像和宽度的数组即可。

// Or, to automatically choose from a set of resolutions.
// The width is the width of the image, and the algorithm chooses the best fit.
$(".foo").backstretch([
  [
    { width: 1080, url: "path/to/image1_1080.jpg" },
    { width: 720, url: "path/to/image1_720.jpg" },
    { width: 320, url: "path/to/image1_320.jpg" }
  ]
]);

关于javascript - 当横幅图片存储在javascript中时，如何在媒体查询中向首页横幅添加不同大小的同一图片？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/48739683/