使用jQuery動態應用背景圖像消失

我已經運行了關於使用jQuery在正文中執行背景圖像更改的每個選項，並且一次又一次地運行到同一個事物中。背景圖像閃爍並消失。
在代碼中，我包含了一些JavaScript警報以暫停頁面，並且在警報被擊中的時候背景圖像已經打開並且看起來很棒，但是當我點擊OK按鈕以超過警報時，圖像就會消失。我最初使用的警報，以確保我得到正確的值。有誰知道爲什麼背景圖片不會「粘住」？我目前的代碼如下 - 我已經嘗試過在網上找到許多不同的代碼塊，並且所有代碼仍然無法更改bg圖像。非常感謝！使用jQuery動態應用背景圖像消失

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; 
    } 
});

來源

2013-10-28 user2928974

我不得不猜測，頁面正在重新加載，嘗試阻止默認行爲（如果這不起作用，發佈鏈接或其他東西，沒有足夠的信息在這裏）。 –

像Karl說的那樣，'$（「nav a」）。click（function（ev）{ev.preventDefault（）...' – Rudy

雖然它是一個簡單的asp.net應用程序，但可能會發生其他情況.net框架感謝您的回覆 - 我將不得不做更多的挖掘 – user2928974

假設你沒有錯誤在其他地方，問題在於你的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"。

來源

2013-10-28 17:16:28 Robusto

感謝您使用更新後的語法 - 我認爲我使用的是較老的語法，可悲的是，它沒有解決問題。做更多的挖掘。 – user2928974

您的路徑也可能有問題。看看它是否有助於在你的url路徑開始處刪除正斜槓。 – Robusto

嘗試 '$（'body'）。css（{「background-image」：「bg1」}）;' – KNU

使用jQuery動態應用背景圖像消失

回答

相關問題