2013-08-02 4 views
2

나는 backbone.js 뷰를 사용 중입니다.강제로 div를 표시하는 방법

확장 가능한 백본보기 목록이 있고 그 안에는 표가 있습니다. 열 중 하나에 dropdown div가 있습니다.

이 div는 부분적으로 다른보기 뒤에 숨겨집니다. enter image description here 위의 그림에는 목록보기 뒤에 숨겨진 dropdown보기가 있습니다.

그래서 나는 div가 표시되도록 강제하는 법을 묻고 싶습니다. 중복되지 않습니다. 고정 된 위치를 사용하고 싶지 않습니다. 모든 위치의 위치를 ​​고정 할 것이기 때문입니다.

주목 : mozilla 개발자 도구를 사용하여 3D보기에서 찾았습니다. div보기는 TOP MOST 레이어에 있습니다. 브라우저에서 로딩 후 enter image description here

내 HTML : 드롭 다운 사업부를 통해

<div class="dropdown open" > 
<ul class="dropdown-menu" role="menu"> 
    <li><div class="menuitem"><label class="checkbox"><input type="checkbox" value="res" style="opacity: 0.0; position: absolute; left: -9999px">Response</label></div></li> 
    <li><div class="menuitem"><label class="checkbox"><input type="checkbox" value="req" style="opacity: 0.0; position: absolute; left: -9999px">Request</label></div></li> 
    </ul> 
    </div> 

CSS :

.dropdown-menu { 
position: absolute; 
top: 100%; 
left: 0; 
z-index: 1000; 
display: none; 
float: left; 
min-width: 160px; 
padding: 5px 0; 
margin: 2px 0 0; 
list-style: none; 
background-color: white; 
border: 1px solid #ccc; 
border: 1px solid rgba(0, 0, 0, 0.2); 
-webkit-border-radius: 6px; 
-moz-border-radius: 6px; 
border-radius: 6px; 
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 
-webkit-background-clip: padding-box; 
-moz-background-clip: padding; 
background-clip: padding-box; 
} 
+0

HTML과 CSS를 함께 제공하십시오. – AmazingDreams

+5

아마도 오버플로 : 숨김; 문제가 있지만 귀하의 html과 CSS를하지 않고 그냥 추측. –

+0

html/css를 보지 않고 말하기가 어렵습니다. 그러나 Patsy issa는 오버 플로우가 될 수 있다고 말했다. 아니면 잘못된 zindex? – Konstig

답변

0

문제는 부모 목록 사업부의 Z 지수이었다. 이 상위 목록 div의 z 색인은 dropdown div의 z 색인보다 큽니다.

그래서 간단히 dropdown div의 z 색인을 상위 목록 div보다 작게 줄였습니다. 문제가 해결되었습니다.

더 많은 결론을 내릴 수 있습니다. Mozilla 3D 개발자보기에서는 z 인덱스를 다루지 않습니다. 중첩 된 3D보기 만 표시합니다. 부모 div는 z 인덱스와 상관없이 항상 mozilla 3D 뷰의 하위 div 뒤에 표시됩니다. 친절하게도 어딘가 잘못되면 저를 바로 잡으십시오.

관련 문제