문제

나는 modal dialog 그 안에 다른 비모달 패널이나 대화 상자를 열어야 하는 일부 "도움말 링크"가 있는 양식입니다(기본 대화 상자는 모달로 유지하면서).

그러나 이러한 것들은 항상 가면 뒤에 숨어 있습니다. YUI 가장 높게 인식하는 것 같습니다. z-index 거기에 마스크와 모달 대화 상자를 그보다 높게 설정합니다.

도움말 콘텐츠를 패널화하기를 기다리면 더 높은 Z-색인을 갖도록 설정할 수 있습니다.여태까지는 그런대로 잘됐다.문제는 보조 비모달 대화 상자 내의 필드에 초점을 맞출 수 없다는 것입니다.그 아래의 모달 대화 상자는 초기 모달 대화 상자가 아닌 다른 항목으로 초점이 이동하는 것을 어떻게든 방해하는 것 같습니다.

YUI가 이를 허용하지 않는다면 jQuery를 사용하여 이 "대화 그룹 양식"을 수행할 수 있는 경우에도 허용될 수 있습니다.

돕다!

도움이 되었습니까?

해결책

기본적으로 YUI는 YAHOO.widget.Overlay를 확장하고 오버레이 패널을 사용하는 모든 항목의 z-index를 관리합니다.이는 YAHOO.widget.Overlay의 "bringToTop" 메소드를 통해 수행됩니다."bringToTop" 메소드를 빈 함수로 변경하면 이 기능을 끌 수 있습니다:

YAHOO.widget.Overlay.prototype.bringToTop = function() { };

해당 코드는 이 기능을 완전히 끄므로 이를 Container.js 파일의 맨 아래에 넣으면 됩니다.나는 그 접근 방식이 약간 큰 망치 접근 방식에 가깝다고 생각하므로 YUI 클래스를 확장하고 "super.constuctor"를 호출한 후 다음을 작성합니다.

this.bringToTop = function() { };

이렇게 하면 본질적으로 요소의 z-인덱스를 직접 관리할 것임을 YUI에 알리는 것입니다.아마도 괜찮을 것입니다. 하지만 그렇게 하기 전에 고려해야 할 사항이 있습니다.

다른 팁

사용자가 다른 요소와 상호 작용해야 하는 경우 원본 대화 상자는 모달일 수 없습니다. 이것이 바로 모달의 정의입니다.원래 대화는요? 정말 전혀 모달이어야합니까?그렇다면 다른 요소를 열기 전에 원래 대화 상자의 모달 속성을 전환해 보셨나요?

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