Question

我正在尝试使用modernizr，因此javascript可以检测浏览器是否支持object-fit和object-position。我从modernizr获得的代码工作正常，但如果它检测到类似no-object-fit之类的东西，我想执行这段代码：

if (!Modernizr.objectfit) {
    $('.wrapper__figure').each(function() {
        var $container = $(this),
            imgUrl = $container.find('img').prop('src');
        if (imgUrl) {
            $container
                .css('background-image', 'url(' + imgUrl + ')');
        }
    });
}

我似乎没有这个工作。如果我检查开发者模式，我不会在浏览器内部进行任何更改（我只在IE中测试它。所有其他浏览器都不需要这样做）。我认为这与将.css('background-image', 'url(' + imgUrl + ')');添加到$container有关，但我不确定是否是这种情况

Answer 1

其attr不是prop - 因为src是属性，而不是属性。

if (Modernizr.objectfit) {
    $('.wrapper__figure').each(function() {
        var $container = $(this),
            imgUrl = $container.find('img').attr('src');

        if (imgUrl) {
            $container.css('background-image', 'url(' + imgUrl + ')');
        }
    });
}

不通过javascript添加背景图片

1 个答案: