更改jQueryUI對話框的顏色關閉X

我有一個jQueryUI對話框，但關閉它的X與背景顏色相同。我怎麼能改變它。我使用了託管在他們網站上的jqueryUI CSS，並且它可以工作，所以它一定是我的jQuery主題。我在http://www.tapmeister.com/dialog/上有一個實例，代碼如下所示。由於更改jQueryUI對話框的顏色關閉X

<!DOCTYPE HTML> 
<html> 
    <head> 
     <title>test</title> 
     <meta charset="utf-8" /> 
     <meta name="robots" content="noindex" /> 
     <script src="http://code.jquery.com/jquery-latest.js"></script> 
     <link href="css/ui-lightness/jquery-ui-1.9.0.custom.css" type="text/css" rel="stylesheet" /> 
     <script src="js/jquery-ui-1.9.0.custom.min.js" type="text/javascript"></script> 
     <style type="text/css"> 
      .ui-dialog-titlebar { border:0; background:none; color:#000000; } 
     </style> 

     <script type='text/javascript'> 
      $(document).ready(function() {$("#dialog").dialog({autoOpen: true});}); 
     </script> 

    </head> 

    <body> 
     <div id="dialog" title="Title">Hi There!</div> 
    </body> 
</html>

來源

2012-10-11 user1032531

你的圖像顏色爲白色：http://www.tapmeister.com/dialog/css/ui-lightness/images/ui-icons_ffffff_256x240.png

在Photoshop中打開文件或某些其他照片編輯程序。然後做一個顏色覆蓋到你想要的顏色。在Photoshop中，它將是「菜單>圖層>圖層樣式>顏色疊加」。保存，然後上傳文件。

使用現有的橙色圖像可能會更好。只需使用CSS不透明度即可。

.ui-widget-header .ui-icon { 
background-image: url(images/ui-icons_ef8c08_256x240.png); 
opacity: 0.4; 
filter: alpha(opacity=40); 
} 

.ui-state-hover .ui-icon, .ui-state-focus .ui-icon { 
background-image: url(images/ui-icons_ef8c08_256x240.png); 
opacity: 1; 
filter: alpha(opacity=100); 
}

這樣就會有一個圖像被調用。

編輯：

查找代碼：

.ui-state-hover .ui-icon, .ui-state-focus .ui-icon { 
background-image: url(images/ui-icons_ef8c08_256x240.png); 
} 
.ui-widget-header .ui-icon { 
background-image: url(images/ui-icons_ffffff_256x240.png); 
}

替換爲：

.ui-widget-header .ui-icon { 
background-image: url(images/ui-icons_ef8c08_256x240.png); 
opacity: 0.4; 
filter: alpha(opacity=40); 
} 

.ui-state-hover .ui-icon, .ui-state-focus .ui-icon { 
background-image: url(images/ui-icons_ef8c08_256x240.png); 
opacity: 1; 
filter: alpha(opacity=100); 
}

來源

2012-10-11 16:02:26 Xarcell

只是改變的最好方法什麼令我困惑的是螢火蟲說未能加載圖像的網址。 – user1032531

您的示例似乎不起作用。 – user1032531

是過濾器：alpha（opacity = 40）;正確？ – user1032531

行262：

.ui-widget-header .ui-icon { 
background-image: url("images/ui-icons_ffffff_256x240.png"); 
}

你需要一個新的圖像添加到這個精靈（或完全新圖片）這是你想要的顏色。

來源

2012-10-11 15:58:31

我從來沒有與精靈工作過。我似乎在目錄中有幾個。 ui-icons_222222_256x240是黑色的，應該可以工作。什麼是從使用ui-icons_ffffff_256x240並使用ui-icons_222222_256x240 – user1032531

更改jQueryUI對話框的顏色關閉X

回答

相關問題