Question

我已经了解了使用jQuery在身体中执行背景图像更改的每个选项，并且我一遍又一遍地遇到同样的事情。背景图像闪烁并消失在代码中，我已经包含了一些javascript警报来暂停页面并且背景图像已经启动，并且在警报被点击时看起来很棒，但是在我点击“确定”按钮超过警报后，图像消失了。我最初使用警报来确保我获得正确的值。有谁知道为什么背景图像不会“粘住？” 我目前的代码如下 - 我已尝试使用网络上的许多不同代码块，并且所有代码仍无法更改bg图像。非常感谢！

var bg1 = "url(/images/bg1.jpg)";
var bg2 = "url(/images/bg2.jpg)";
var bg3 = "url(/images/bg3.jpg)";

$("nav a").click(function () {
    var id = $(this).attr("id");
    //alert(id);

    switch (id) {
        case "home":
            $('body').css({ backgroundImage: bg1 });
            //alert("case - home");
            break;
        case "about":
            $('body').css({ backgroundImage: bg2 });
            //alert("case - about");
            break;
        default:
            $('body').css({ backgroundImage: bg3 });
            break;
    }
});

Answer 1

假设您在其他地方没有错误，问题在于您的CSS属性，该属性应引用为字符串：

var bg1 = "url(/images/bg1.jpg)";
var bg2 = "url(/images/bg2.jpg)";
var bg3 = "url(/images/bg3.jpg)";

$("nav a").click(function () {
    var id = $(this).attr("id");
    //alert(id);

    switch (id) {
        case "home":
            $('body').css({ "background-image": bg1 });
            //alert("case - home");
            break;
        case "about":
            $('body').css({ "background-image": bg2 });
            //alert("case - about");
            break;
        default:
            $('body').css({ "background-image": bg3 });
            break;
    }
});

我所做的就是将backgroundImage更改为"background-image"。

使用jQuery动态应用的背景图像消失

1 个答案: