爲jQuery對話框提供不同的主題？

我有一個包含以下jQuery腳本/主題的頁面。我想要的默認主題是所有適用元素的「ui-lightness」，但我希望根據'cupertino'主題來設置jQuery對話框的樣式。我如何在我的頁面中實現這個要求？爲jQuery對話框提供不同的主題？

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>jQuery UI Example Page</title> 
    <link type="text/css" href="css/cupertino/jquery-ui-1.8.21.custom.css" rel="stylesheet" /> 
    <script type="text/javascript" src="js/jquery-1.7.2.min.js"></script> 
    <script type="text/javascript" src="js/jquery-ui-1.8.21.custom.min.js"></script> 
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>

來源

2012-07-17 Sunil

如果你看一個對話框元素。查看創建時添加的類。然後查看相應的css文件，並將cupertino主題類複製到lightness css文件中，替換亮度文件中的類。它的所有風格與CSS和所有的類都命名相同（我相信），所以它會工作得很好，如果你只是做半自定義的CSS文件。

來源

2012-07-17 00:30:12 jeschafe

我不認爲它像在兩個主題之間交換CSS樣式一樣簡單。我做到了，但沒有任何區別。什麼決定了對話框標題欄的背景顏色以及決定對話框按鈕外觀的因素？ – Sunil 2012-07-17 00:45:52

你是對的。我認爲，根據您的建議，需要替換/ * Component容器下的CSS * /將所有必要的圖像文件複製到圖像文件夾以創建混合主題。但是，必須注意除了對話框控件以外的其他元素不會在其CSS樣式中發生更改。 – Sunil 2012-07-17 02:08:40

我認爲所有的jQuery UI類與ui-開始，所以你能找到的對話框控件和更改所有的樣式在它與ui-開始說Xui-，並有其他題材有類與Xui-代替ui-

var widget = $('#dialog').dialog('widget'); 
widget.find('[class^=ui-]').add(widget).each(function(){ 
    $this = $(this); 
    var classes = $this.attr('class'); 
    $.each(classes.split(' '), function(i, v){ 
     if (v.indexOf('ui-') == 0){ 
      this.removeClass(v); 
      this.addClass('X'+v); 
     } 
    }); 
});

來源

2012-07-17 01:25:13 Musa

我會嘗試你的建議。看起來像一個整潔的想法。謝謝 – Sunil 2012-07-17 01:54:10

@Sunil我試過了，它出現不好http://jsfiddle.net/DgQys/ – Musa 2012-07-17 02:33:49

@ Musa-感謝您的努力。我想調整CSS是最好也是最直接的方法。 – Sunil 2012-07-17 04:22:53

爲jQuery對話框提供不同的主題？

回答

相關問題