2010-07-28 5 views
5

다음 코드는 JQueryUI 대화 상자 팝업을 만듭니다.JQueryUI 대화 상자 표시 문제

$j('<div></div>') 
     .html(message) 
     .dialog({ 
      autoOpen: true, 
      bgiframe: true, 
      buttons: { 'Dismiss': function() { $j(this).dialog('close') } }, 
      closeOnEscape: true, 
      height: 'auto', 
      modal: true, 
      resizable: true, 
      width: 400, 
      title: 'An error has occurred'}); 

팝업이 처음 사용자에게 표시 될 때 거대한 머리글이있는 아래 이미지처럼 보입니다. 나는 팝업에 추가되는 CSS 클래스가 없다는 것을 알고있다.

JQuery 팝업의 크기를 조정 한 후에도 팝업이 올바르게 표시됩니다. 헤더가 즉시 크기가 조절되고 올바르게 표시됩니다.

다른 누구도 이전에이 문제를 겪었습니까?

alt text http://i26.tinypic.com/156vl3n.png

+0

(대신이 게시물에 대한 답변 이동); 대화 상자에 CSS를 포함하는 것을 잊었을 수 있습니다. 예를 들어 테마 롤러를 통해 테마를 빌드 할 때, UI 위젯 클래스를 사용하기 때문에 기본 스타일이 적용됩니다. 그런 다음 기본 스타일이 포함 된 각 모듈에 의해 개별적으로 재정의됩니다. 사용자 정의 jQuery UI – peol

답변

1

그냥 당신의 도움을 주셔서 감사

3

내가 전에 그 문제로 실행 적이 있지만이 두 가지 제안 : 당신은 증상이 아니라 문제를 해결하려면

을, 당신이 스타일의 재정의를 할 단지 수 :

.ui-widget-header { height: 100px }

한 번에 하나씩 옵션을 제거하여 문제를 일으키는 지 확인할 수도 있습니다.

+0

나는 체계적으로 옵션을 제거하려고 시도했지만 그 중 아무 것도 문제가 아닌 것으로 보입니다. 잘 보면서. 내가 알아낼 수 없으면 각 스타일을 덮어 쓸 수 있다고 생각합니다. 그래도 문제가 해결되지 않았나? –

+0

그래, 확실히,하지만 불행히도 최후의 수단으로 자주 당신의 유일한 것입니다 ... 내가 생각할 수있는 유일한 다른 문제는 당신이 만든 스타일이나 스크립트의 충돌 일 것입니다. 스팬이나 div에 영향을 미칠 수있는 스타일이 있습니까? – Will

+0

내가 볼 수있는 것은 아닙니다. 파이어 버그 (Firebug)에 따르면 아무것도 JQuery 스타일에만 적용된다고한다. –

1

이 대화 헤더 문제를 들어 당신이 단순히 대화 상자의 부모 클래스에 다음 속성을 추가 할 수 있습니다 것입니다 ... 최신 UI의 CSS로 업데이트 챔피언처럼 일

.ui-dialog { clear: both; }