自定義形狀和更改背景圖像的按鈕與jQuery的？

Question

是否有可能具有矢量形狀，並通過jQuery中的按鈕動態更改背景圖像？

即我需要有一個自定義形狀，能夠有一個按鈕，可以將背景圖像更改到別的東西..

例如：

說有3個按鍵，一個星形說綿羊，一個說點，一個說純色

這些按鈕用預設圖像應用於按鈕名稱來更改星形的背景圖像？

如果有道理？

在此先感謝

李

Answer 1

我將開始與一個簡單的方形格面積和使用此代碼改變圖像。

$('#btn1').click(function() { 
    $('#divBackground').css('background-image', 'stars.jpg'); 
}); 

$('#btn2').click(function() { 
    $('#divBackground').css('background-image', 'sheep.jpg'); 
}); 

$('#btn3').click(function() { 
    $('#divBackground').css('background-image', 'dots.jpg'); 
}); 

那麼我可能會躺在這上面的圖像分度，切出的中間作爲一個剪貼蒙版使用星形。我可能會對CSS有點困難，您可能需要修改定位和z-index以使其正確。

另一種選擇是探索HTML5畫布的功能，可能會更簡單一些。

這裏是一個概念性例子：http://jsfiddle.net/VTQSM/1/

Answer 2

它沒有任何意義，但這裏是什麼讓你開始：

$("#button").css("background-image", "stars.jpg")