2012-01-09 90 views
0
$(document).ready(function() { 
    $('#picture').css('height', '666px'); 
    $('#picture').click(function() { 
     $(this).css('background-image', "url('../images/picture_2.jpg')"); 
    }); 
}); 

在上面的代碼中,height已成功更改爲666px,但背景圖像根本不變(仍爲原始圖像)。我如何更改使用jQuery的css背景圖片?

當我將background-image更改爲'none'而不是「url('../ images/picture_2.jpg')」時,它確實使背景圖像消失。

我在做什麼錯?

+0

嘗試從url內部刪除單引號() – 2012-01-09 20:12:15

+0

哪個瀏覽器?它可能只是不會加載它.. – FakeRainBrigand 2012-01-09 20:12:48

+0

@bobek沒有工作 – 2012-01-09 20:12:59

回答

5

我的猜測是你輸入的URL不正確。該網址應該與您在上的頁面相關。我敢打賭你的網址是相對於你的CSS樣式表。一般來說,只要在JS中使用絕對路徑。

您也不需要圍繞路徑的單引號。

1

更正圖像的路徑。

圖像的路徑將從網站的根目錄計算,而不是從css計算。

只是爲了澄清:

高度將改變頁面中,如果#picture元素被點擊凡爲背景圖像只會更改的負荷。

2

您提供的代碼應該可以正常工作。我認爲您提到的圖片位置​​不正確。檢查是否可以在螢火蟲中看到該位置的圖像。

我試過相同的代碼,它對我來說工作得很好。 DEMO這裏