2013-01-21 110 views
0

我嘗試在下拉的(選擇)選項更改時動態更改div的背景。我正在使用data-bg屬性來指定應該使用的背景。但是我無法弄清楚如何從當前選擇的選項中獲取屬性。根據選擇的選項更改背景圖片

現狀:http://jsfiddle.net/7xYv3/

我的javascript:

 $('#game-list').change(function() { 
     var selectValue = $("#game-list").val(); 
     var gameBackground = $(selectValue).attr("data-bg"); 
     changeBg(gameBackground); 
    }); 

    //change the background color based on the data-bg attribute 
    function changeBg(bg) { 
     $(".welcome").css('background-image', 'url("' + bg + '")'); 
    } 

此外,在一個完全無關的音符......在哪裏我可以找到具有圖像只能選擇下拉信息任何提示?我很樂意使用下拉式圖標代替文字。

+1

如果你想要一個只有圖象的下拉你需要使用一個使用一個無序列表或資料覈實一個選擇替換腳本。請參閱:http://tutorialzine.com/2010/11/better-select-jquery-css3/ –

回答

3
$('#game-list').change(function() { 
    changeBg($('option:selected', this).data('bg')); 
}); 

這是你的提琴:http://jsfiddle.net/7xYv3/1/

+0

非常感謝!奇蹟般有效! – MCG

相關問題