문제 jquery 대화할 때 사용하여 themeroller css

StackOverflow https://stackoverflow.com/questions/45600

문제

이 데모 에 대한 jquery ui 대화 모두를 사용하여 플 테마입니다.내가 원하는 사용자 정의 테마,그래서 내가 사용하는 themeroller 를 생성하 css 파일입니다.내가 그것을 사용하는 경우,모든 것을 듯 하지만 정상적으로 작동 하는 나중에 내가 발견할 수 없는 어떤 제어 입력 요소에 포함되는 대화입니다(i.e 할 수 없는 형식으로 텍스트 필드,을 확인할 수 없습니다란).추가 조사를 밝혔다 이런 경우 설정 대화 특성"모달하는"사실이다.이 일어나지 않는다면 내가 사용하는 식물 테마입니다.

여기에 js file:

topMenu = {
    init: function(){
        $("#my_button").bind("click", function(){
            $("#SERVICE03_DLG").dialog("open");
            $("#something").focus();
        });

        $("#SERVICE03_DLG").dialog({ 
            autoOpen: false,
            modal: true, 
            resizable: false,
            title: "my title",
            overlay: { 
                opacity: 0.5, 
                background: "black" 
            }, 
            buttons: { 
                "OK": function() { 
                    alert("hi!");
                }, 
                "cancel": function() { 
                    $(this).dialog("close"); 
                } 
            },
            close: function(){
                $("#something").val("");
            }
        });
    }
}

$(document).ready(topMenu.init);

다음은 html 을 사용하는 식물 테마

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>sample</title>
<script src="jquery-1.2.6.min.js" language="JavaScript"></script>
<link rel="stylesheet" href="flora/flora.all.css" type="text/css">
<script src="jquery-ui-personalized-1.5.2.min.js" language="JavaScript"></script>
<script src="TopMenu.js" language="JavaScript"></script>
</head>
<body>

<input type="button" value="click me!" id="my_button">
<div id="SERVICE03_DLG" class="flora">please enter something<br><br>
<label for="something">somthing:</label>&nbsp;<input name="something" id="something" type="text" maxlength="20" size="24">
</div>

</body>
</html>

다음은 html 을 사용하는 다운로드 themeroller 테마

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>sample</title>
<script src="jquery-1.2.6.min.js" language="JavaScript"></script>
<link rel="stylesheet" href="jquery-ui-themeroller.css" type="text/css">
<script src="jquery-ui-personalized-1.5.2.min.js" language="JavaScript"></script>
<script src="TopMenu.js" language="JavaScript"></script>
</head>
<body>

<input type="button" value="click me!" id="my_button">
<div id="SERVICE03_DLG" class="ui-dialog">please enter something<br><br>
<label for="something">somthing:</label>&nbsp;<input name="something" id="something" type="text" maxlength="20" size="24">
</div>

</body>
</html>

당신이 볼 수있는,단지 참조 css 파일과 클래스 이름을 다르다.사람이 단서가 무엇이 잘못 되었나요?

@데이비드:나는 그것을 시도하며,그것은 작동하지 않는 것(도에 FF 또는 IE).I tried 인라인 css:

style="z-index:5000"

고 나도 그것을 참조하는 외부 css file:

#SERVICE03_DLG{z-index:5000;}

그러나 이러한 일이다.나는 누락에서 뭔가를 당신이 무엇을 제안했?

편집:
를 해결에 의해 brostbeef!
이었을 때부터 원래 사용하여물,나는 실수로 내가 지정 등 특성이 있습니다.집,이것은 진실한 경우 실제로 사용하는 식물 테마(으로 샘플에서).사용하는 경우에는 사용자 정의 테마를 지정하여 클래스 속성이 발생하는 이상한 행동을 했다.

도움이 되었습니까?

해결책

내가 생각하기 때문에 그것이 당신의 클래스가 다릅니다.
<div id="SERVICE03_DLG" class="flora"> (flora)
<div id="SERVICE03_DLG" class="ui-dialog"> (주)

심지어 식물 테마,당신은 여전히 사용하 ui 대화하는 클래스로 정의합니다.

나는 조동하기 전에 나는 본 적이 없더라도 클래스를 정의에 태그가 있습니다.jqueryui 의해야 할 수 있습니다.

시애 클래스의 특성하거나 사용하는"ui 대화"클래스입니다.

다른 팁

재생 후에서 방화,를 추가하는 경우 z-index 특성보다 큰 1004 기본 div id"SERVICE03_DLG",그것은 작동합니다.나는 그것에게 무언가가 매우 높은,다음과 같 5000,단지 확인합니다.

나는 확실하지 않다 그것이 무엇인지에 themeroller CSS 는 경우 종종 이런 문제가 발생합니다.그들은 아마도 변경하거나 무시되는 위치의 특성상 div 는 변화입니다.

나를 구현했는 themeroller 테마로 대화하고 그것을 밝혀졌 이 themeroller CSS 으로 작동하지 않 공식 jQuery!특히 대화상자의 탭이,그들은 수정 요소의 클래스에서는 공식 jquery 것들입니다.는 여기를 참조하십시오:http://filamentgroup.com/lab/introducing_themeroller_design_download_custom_themes_for_jquery_ui/

사용자의 코멘트:

3)생성된 테마는 내가 다운로드한 것 불완전한 것- 려고 시도하면 그것을 사용하는 내 탭 (는 작업으로 식물 테마,코드 동일한 설명서 예)하지 스타일의 탭으로

을 실행하로 3 줄 알았 갇히고 있을 되돌리려면 사용 "flora"...내가 있기 때문에 의해 발견 독서의 소스 코드"demo" 파일이 있는 경우 조정 html 고 이 < li>항목을 사용에 대한 내 탭 "ui-탭 nav-품목"등 다음 작동합니다.

테마에 의해 생성된 themeroller 가 따라서 불행하게도 완전하지 않습니다.는 경우 탭은 물건은 불완전하고,그것이 나를 궁금 다른 무엇이 완전하지 않습니다.그 오히려 실망입니다.:(

다음 themeroller 개발자의 코멘트:

3)우리는 우리를 살펴 보겠습니다.당신은 맞는 해당 클래스 추가해야에 의하여 플러그인입니다.지금은 하지만,그것은 아마 해치지 않을 것 많은 매개 변수를 추가하기만 하면 태그 그래서 당신 을 사용할 수 있습 themeroller 다.우리는 그것을 확인합니다,하지만.나는 생각을 우리의 선택이 될 수 기반의 부모 ui-탭을 선택기 대신 그러나 내가 생각하 우리가 하려고 했던 사용하지 않는 요소에 우리의 선택.고려 그것은에서 할 일 목록

사람,이것은 좋은 일입니다.나가려고 하는 무리의 물건에 이러한 두 개의 페이지입니다.당신이 노력했지만 떠나 CSS 모두 노력하고 모두 다음 페이지?내가 사용하는 방화범을 제거하 CSS 에서 헤더 모두에서 페이지를 입력은 여전히 일에 하나가 아닌 다른-그러나,난다고 생각하는 경향이 불을 지르지 않는 완전히 제거 CSS 에서 렌더링,당신은 다른 결과를 얻을 경우에 당신은 실제로 그것을 제거에서의 코드입니다.

또한 발견할 수 있는 텍스트를 붙여넣을 텍스트 상자에 마우스를 사용하여-그것은 그냥 받아들이지 않을 키보드로 입력합니다.거기에있을 것 같지 않는 모든 이벤트 처리기에 그것을 방해하는습니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top