2013-07-21 1 views
0

좋은 css3 드롭 다운 스크립트를 찾았지만 마지막으로 읽은 것이 방문의 10 %이므로 ie8 사용자를 포기할 수는 없습니다. 그래서,이 시도 :어떻게하면이 div가 IE8에서 컨테이너가 확장되고 오버플로되도록 할 수 있습니까?

<div id="containerdiv" style="height: 35px; overflow: visible;" > 
<a href="#"><img src="images/1.jpg"></a> 
<a href="#"><img src="images/2.jpg" 
onmouseenter="document.getElementById('navdd1').style.display = ''"></a> 
<div id="navdd1" 
    style=" 
      display: none; 
      margin-left: 100px; 
      background-image:url('images/blank_dropdown.jpg'); 
      line-height: 35px; 
      width: 100px;" 
    onmouseleave="document.getElementById('navdd1').style.display = 'none'"> 
    <a href="#">Link 1</a><br> 
    <a href="#">Link 2</a><br> 
</div> 
</div> 

mouseenter와하는 MouseLeave 내가하고 싶은 일을하는 것을하지만 않은 숨겨진 사업부는 오버 플로우를 대신 컨테이너를 뻗어. 나는 PHP를 사용하여 브라우저를 탐지하고 IE <에있을 때만 이것을 제시 할 것이다. 9. 아이러니하게도이 오버플로 부분은 내가 FF에서 원하는 것을 수행하지만, 물론 mouseleave는 그렇지 않다. 이 작업을 어떻게 수행합니까?

+1

당신은 position : absolute를 사용한다고 가정합니다; 나는 짐작한다 –

+0

@GCyrillus 그것이 그랬던 것처럼 간단하게, 만일 당신이 대답으로서 그것을 게시하면, 나는 그것을 받아 들일 것이다. 'position : absolute; 왼쪽 : 100px; 상단 : 35px; /* margin-left : 100px; * /' – TecBrat

+0

oki then :) 위대한 도움을주었습니다 –

답변

0

#navdd1position:absolute;으로 설정해야합니다.

#navdd1 { 
      display: none; 
      margin-left: 100px; 
      background-image:url('images/blank_dropdown.jpg'); 
      line-height: 35px; 
      width: 100px; 
      position:absolute; 
} 

position:relative;에서 아마 #containerdiv 쉽게 #navdd1에 coordonates을 제공합니다.

+0

맞아요, 제 다른 코멘트에서 컨테이너에 위치 : 상대적을 넣었습니다. 그래서 드롭 다운이 절대적이었습니다. – TecBrat

+0

다음과 함께 위대함, 행운 : –

+0

IE8 지원을 포기하도록 클라이언트의 허가를 얻으려고합니다. :) – TecBrat

관련 문제