이틀 동안 고생한 끝에 마침내 아이디어가 떠올랐습니다. 한번 시도해 보세요. ! ! 코드 복사 코드는 다음과 같습니다. .org/1999/xhtml"> < ;head> <제목>제목 없는 문서 <br>ul{margin:0;padding:0} <br>li{position:relative;margin :0;padding:0;;} <br>.grid{ 배경:#ccc;너비:100px;높이:100px;;} <br>.f{배경:#333;너비:200px;높이:200px;위치:절대;상단:0;왼쪽:100px;디스플레이:없음} <br> <br>jQuery(function(){ <br>window .a=0; window.b=1; //동일 숨겨진 팝업 레이어 1개<br>$('ul').delegate('.grid','mouseover',function(){ // 아바타에 마우스를 올려 놓습니다.<br>if($('.f') ){ <br>$('ul').append('<div class="f"></div>') <br>$( '.f').css({top:$( this).offset().top}) <br>} <br>window.a=0 <br>$('.f').show() <br>}) <br><br>$ ('ul').delegate('.f','mouseover',function(){// 마우스가 팝업 레이어에 있습니다 <br>window.b=0; <br>}); $('ul').delegate('.grid','mouseout',function(){//마우스가 아바타를 떠남 <br>window.a=1; <br>}) <br>$('ul' ).delegate('.f','mouseout',function(){// 팝업 레이어를 그대로 둡니다 <br>window.b=1; <br>}) <br><br>setInterval(function( ){//console.log(window.a " " window.b " " window.c) <br>if(window.a&&window.b){ <br>$('.f') .hide(); <br>} <br>},100) <br>}) <br> 🎜> < /div> /li> div> "그리드"> ;div class="grid">