Jquery 대화 상자 편집 CSS

Question

닫을 다른 'X'를 표시하는 투명 제목 표시 줄을 갖도록 대화 상자를 편집하려고하지만 여기에 내 대화 상자 CSS가 있습니다.

/* Creates the 'X' used to close dialog */ 
.ui-widget-header .ui-icon 
{ 
    background-image: url("../Images/X.png") !important; 
} 

/* Removes padding from title bar */ 
.ui-dialog .ui-dialog-titlebar 
{ 
    padding: 0; 
    position: relative; 
} 
/* Remove title image and keep 'x' */ 
.ui-widget-header { 
    background: transparent repeat-x scroll 50% 50% #F6A828; 
    border: 1px solid #E78F08; 
    color: #FFFFFF; 
    font-weight: bold; 
} 

현재 투명도는 기본 색상을 초과하지 않으며 (!important은 아무 것도 변경되지 않음) 'x'가 표시되지 않습니다 (기본값은 아니지만). 어떤 제안?

편집 :이 link은 내 코드가있는 대화 상자를 보여줍니다. 백그라운드가 실행될 때 투명하지 않은 것을주의하십시오. 그것을 조금 놀고 난 후에, 나는 이미지가로드 중이다라고 생각한다. 그러나 나는 그것을 보지 못한다. (색깔은 매우 비슷하다) 일단 제목 색이 해결되면 그 이슈 또한 사라질 것이다.

Answer 1

당신은

background: transparent repeat-x scroll 50% 50%; 

Answer 2

여기에있다. 제목 이미지를 제거하지 않고 이전에 해본 적이있는 것이지만 'X'만 포함하도록 축소했습니다. 그리고 모두 js에서 열 때.

$('#dialog').dialog(); 
var d = $('#dialog').dialog('open'); 

var titleBar = d.parent().find('div.ui-dialog-titlebar'); 
d.parent().find('span.ui-dialog-title').text(''); 
titleBar.css({ 
    'width' : '10px', 
    'height' : '10px', 
    'float' : 'right', 
    'top' : '-35px'//only used to move x above dialog. not needed. 
});