다른 테마를 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 파일을보고 밝기 파일의 클래스를 대체하는 lightness css 파일에 cupertino 테마 클래스를 복사하십시오. 그것은 CSS로 모든 스타일이 있고 모든 클래스는 똑같은 (나는) 믿습니다. 그래서 세미 - 사용자 정의 CSS 파일을 만들면 잘 작동합니다.

출처

2012-07-17 00:30:12 jeschafe

2 가지 테마 사이에서 CSS 스타일링을 바꾸는 것만 큼 간단하지 않다고 생각합니다. 나는 그렇게했지만 아무런 효과가 없었다. 대화 상자 제목 막대의 뒤쪽 색상을 결정하고 대화 상자 단추의 모양을 결정하는 것은 무엇입니까? – Sunil

정확합니다. 제 생각에,/* 컴포넌트 컨테이너 */아래의 CSS를 대체해야하고, 필요한 모든 이미지 파일을 이미지 폴더에 복사하여 혼합 테마를 만드는 것이 좋습니다. 하지만 대화 상자 컨트롤 외의 다른 요소가 CSS 스타일을 변경하지 않도록 조심해야합니다. – Sunil

나는 그래서 당신은 대화 위젯을 찾아 Xui- 말을 ui-로 시작하는 그 모든 스타일을 변경하고 다른 테마 대신 ui-

의 Xui-로 수업을 가질 수있는 모든 JQuery와 UI 클래스가 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

@ 수녀 나는 그것을 시도하고 그것은 잘 나오지 않았다 http://jsfiddle.net/DgQys/ – Musa

@ 무사 - 노력에 감사드립니다. 나는 CSS를 조정하는 것이 가장 좋고 가장 직접적인 방법이라고 생각한다. – Sunil

다른 테마를 jQuery 대화 상자에 적용 하시겠습니까?

답변

관련 문제