在 jQuery 内更改 CSS 无效

Question

我正在尝试使用 jQuery 将背景图像添加到 CSS class，如下所示。目前代码破坏了所有其他 jQuery，所以我想这一定是语法问题。

我也添加了两个过滤器以获得最大支持。

任何帮助将不胜感激:)))

$(document).ready(function(){
    if ( ($(".coaching-section-1").length > 0) && ($(window).width() >= 481) && ($(window).width() < 1030) ) {
        $('.coaching-bg-private-video').css({
            'background', "url("wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg") no-repeat center right",
            'filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')",
            '-ms-filter', ""progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')"",
        });
    }
});

Answer 1

您的代码格式不正确。您需要转义其他 " 中出现的 "。此外，css 方法需要一个对象。对象的格式如下：{key:value, key2:value2}，而不是 {key,value, key2,value2}

$(document).ready(function(){
    if ( ($(".coaching-section-1").length > 0) && ($(window).width() >= 481) && ($(window).width() < 1030) ) {
        $('.coaching-bg-private-video').css({
            'background': "url(\"wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg\") no-repeat center right",
            'filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')",
            '-ms-filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')"
        });
    }
});

Answer 2

$(document).ready(function(){
    if ( ($(".coaching-section-1").length > 0) && ($(window).width() >= 481) && ($(window).width() < 1030) ) {
        $('.coaching-bg-private-video').css({
            'background', "url('wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg') no-repeat center right",
            'filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')",
            '-ms-filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')",
        });
    }
});

Answer 3

您在 url 中加入了类似的引号，导致字符串中断。这应该有效：

$(document).ready(function(){
    if ( ($(".coaching-section-1").length > 0) && ($(window).width() >= 481) && ($(window).width() < 1030) ) {
        $('.coaching-bg-private-video').css({
            background: 'url("wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg") no-repeat center right',
            filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')",
            '-ms-filter': "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp-content/themes/eddiemachado-bones-9db85e4/library/images/coaching-bg-private-first_frame.jpg', sizingMethod='scale')",
        });
    }
});

在 jQuery 内更改 CSS 无效

Changing CSS within jQuery not working

html

javascript

css

jquery

syntax-error