javascript - -webkit-background-size 不适用于 jQuery Css

标签 javascript jquery html css

我正在尝试在页面加载后加载背景,但它似乎没有像我预期的那样工作。

我之前在 css 中的代码是:

html {
    background: url(<?php echo $this->Cdn->getUrl(); ?>/images/photos/bg-blurred.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-color: #0c1d31;
}

现在我用 jQuery 试试:

jQuery(document).ready(function () {

    jQuery('html').css({
        'background-image': "url('<?php echo $this->Cdn->getUrl(); ?>/images/photos/bg-blurred.jpg')",
        'background-size': "cover",
        'background-color': "#0c1d31",
        '-webkit-background-size': "cover",
        '-moz-background-size': "cover",
        '-o-background-size': "cover",

    }); 
});

“-webkit-background-size”、“-moz-background-size”和“-o-background-size”似乎无法使用 jQuery.css。其他 css 属性工作正常。

有什么想法吗?

最佳答案

如果您只尝试使用“-webkit-background-size”:

jQuery(document).ready(function () {

   jQuery('html').css({
      '-webkit-background-size': "cover"
   });
});

您会看到您的元素将如下所示:

<html style="background-size: cover;">

所以这不是你的问题。

您可能应该查找您的网址:

"url('<?php echo $this->Cdn->getUrl(); ?>/images/photos/bg-blurred.jpg')"

如果您使用的是 chrome,请在“网络”选项卡中按 f12 检查是否有错误。

关于javascript - -webkit-background-size 不适用于 jQuery Css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36377362/

相关文章:

javascript - 如何检查 datetimepicker jquery 中的日期范围?

jquery - 使用 jquery 禁用表内的所有复选框

javascript - 砌体和延迟加载集成

javascript - 使用自定义按钮播放 SoundCloud Stream

javascript - 如何使用 JS 在 HTML 中动态添加图像链接?

javascript - 使用 Yarn on Rails 安装 Modernizr

javascript - 如何引用父文件夹中的javascript?

jquery - jqModal 在 Mobile Safari 中显示不正确

jquery - 在滚动位置上对 HTML 元素进行动画处理

html - Django 静态文件图像不显示