웹 브라우저에 z-index 값에 대한 상한이 있습니까?
문제
Modal Window 구현을 통해 타사 광고가 출혈하는 경우가 있습니다. 모달 오버레이의 z- 인덱스를 가능한 한 높게 위로 올려 놓고 광고가 표시되지 않도록합니다. z-index 값에 한계가 있습니까? 브라우저에 따라 다르면 확실합니다. 누구든지 아는가?
해결책
그것을 명심하십시오 z-index
전 세계적으로 작동하지 않지만 '스태킹 컨텍스트'내에서만 작동합니다 (소화하기 어려운 정의 CSS에서), 광고가 자체 스태킹 컨텍스트를 설정하면 z-index
다른 곳에 설정 한 값은 전혀 영향을 미치지 않을 수 있습니다.
그러나 아마도 "Windowed"플래시의 문제 일 가능성이 높습니다 ( wmode=transparent
속성), 브라우저가 창문 인 것처럼 모든 브라우저 위에 렌더링 브라우저의 창 위. 그러한 경우 z-index
전혀 도움이되지 않습니다. Ad [-Provider]를 사용하도록 강요해야합니다. wmode=transparent
또는 iframes와 함께 미친 해킹을 사용하십시오.
다른 팁
대부분의 브라우저에서 지원되는 최대 Zindex 값은 2147483647 (2^31-1)이지만 Opera 9.2는 2147483583보다 큰 값을 허용하지 않습니다. 버전 9.5로 고정했습니다.
실제로는 아니지만 INT 범위와 같은 시스템의 자연스러운 한계를 고려할 수 있습니다. ID 아마 32,767 미만으로 보관하십시오. 비슷한 문제를 해결하는 동안 JavaScript에서는 확실히 초과했으며 당시에 걱정했던 주요 브라우저 및 플랫폼에 문제가 발생하지 않았습니다.
타사 광고 및 오버레이의 경우 wmode = "투명" 플래시 임베드에는 같은 선을 따라 일반적인 문제가 있습니다. 또한 IE는 Z- 인덱스를 쌓는 버그가 있다는 점에 주목할 가치가 있으므로 성공을 보지 못한 경우 그 벽에 머리를 맞지 않도록하십시오.
나는 항상 어떤 종류의 것을 지키고 싶습니다 협약, 임의의 수치를 사용하지 않습니다. 예를 들어, 내 모든 것의 모든 것일 수도 있습니다 CSS는 0과 10 사이입니다. 어쩌면 DHTML 재료는 100의 장소 값에서 발생하며, 주어진 모듈에 대한 의미있는 z-index가 발생합니다.
*사이드 노트 : IE 버그는 구체적으로 IE가 새로운 문서 흐름 인스턴스를 z-index의 새로운 스택 컨텍스트로 간주한다는 것입니다. 일반적으로 Z-index를 상속하는 하위 노드가 자체 위치 지정 컨텍스트로 렌더링되는 경우 DOM 계층에서 Z 인덱스가 손실되지 않도록해야합니다.
인용 http://techtrouts.com/is-there-a-limit-to-the-css-z-index-property/:
이론적으로 z-index 속성은 OS 및 브라우저에 따라 무제한이거나 적어도 int 유형 범위 내에 있어야합니다. 그러나 브라우저 버그를 피하려면 Z-Index 값을 +/- 32767로 제한해야합니다.