jquery - 根据类的背景设置页面背景颜色？

Question

我想从此 CSS 中提取 background，然后用它来设置页面的 background-color:

.ui-widget-header { border: 1px solid #4297d7; background: #5c9ccc url(images/ui-bg_gloss-wave_55_5c9ccc_500x100.png) 50% 50% repeat-x; color: #ffffff; font-weight: bold; }

我目前拥有的 jQuery:

$(function() {
    var color = $(".ui-widget-header").css("background");
    //var color = "black"; // works fine when uncommented
    $(document.body).css("background-color", color);
});

我知道我离得不远了，因为注释掉的行可以工作并将页面的背景设置为黑色。我认为问题在于 .ui-widget-header 中的 background 不是简单的颜色并且包含图像。

如果这确实是问题所在，我怎样才能只提取颜色(#5c9ccc)？如果更简单的话，普通的旧 Javascript 也可以。

更多背景(没有双关语):我正在使用jQuery-UI Themeroller并希望根据用户选择的主题设置页面背景。

Answer 1

尝试获取background-color:

var color = $(".ui-widget-header").css("background-color");