사람들은 div CSS를 작성할 때 팝업 레이어를 사용하는 경우가 많습니다. IE6의 버그로 인해 여러 태그를 사용하여 팝업 레이어를 반복적으로 작성하면 후속 레이어가 팝업 레이어 위에 겹쳐지는 문제가 발생합니다. Firefox에서는 z-index를 사용하여 브라우저에서 해결할 수 있지만 IE6에서는 작동하지 않습니다. 다음 코드는 이러한 종류의 문제에 대한 솔루션을 제공합니다. 원칙은 다음과 같습니다. 팝업 레이어의 z축이 매우 간단합니다. 호호!
.org/1999/xhtml">
< ;head>
팝업 레이어 문제 해결 방법 제목><스타일>
.box { width:800px; margin:10px auto; z-index:0; ;}
.box ul li { width:150px; height:left; border:solid 1px #ccc; margin:10px ; 목록 🎜>.box ul li .layer { 위치:절대:150px; 높이:100px; 색상:# fff:99999;} ;/style>
body>
- < a href="#"> /a>
- 테스트 뉴스 제목 1
/li>
- 테스트 뉴스 제목 1
- 테스트 뉴스 제목 1
javascript">
for(var i = 0; i < $(".box li").length;i ){
var j = 10000-i
$(".box li" ).eq(i).css("z-index",j);
}
$("#boxcotent li").hover(function (){
$(this).children( ".layer").show();}, function(){$(this).children(".layer").hide();}
)
$("#boxcotent li") .hover(function(){
$(this).addClass("s");},function(){$(this).removeClass("s ");}
); ;/script>