본문 바로가기

html/css

ie6 드롭다운 대체


css로 ie6 구현은 정말 개짜증나는 일이다..

버그로 인해 실패 실패

ie6 핵을 이용하여 구현....
마우스 오버시
display:block-> none 가능
display:none -> block 불가

도저히 못해먹겠다

그래서 자바스크립트 또는 jquery로 구현했다.
<ul id='test'>
 <li onmouseout="myOut()" onmouseover="myOver()">보였다 안보였다 </li>
</ul>

function myOut(){
 document.getElementById('test').style.display='none';
}
function myOver(){
document.getElementById('test').style.display='block';
}


rollover 경우:

$(document).ready(function() {
  try {
   $("li").mouseover(function(){
    $(this).css("background","url(이미지주소)");
   });  
  } catch(e) {}

  try {
   $("li").mouseout(function(){
    $(this).css("background","url()");
    $(this).css("background-color", "#f2f2f2");
   });  
  } catch(e) {}
});