2013-10-07 9 views
0

어떻게 div "b"를 토글 할 수 있으며 div "a"와 "b"사이에 상태를 표시 할 수 있습니까? enter image description here어떻게 표시 상태를 전환 할 수 있습니까?

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
    $(function(){ 
     // how can i do this in js ? 
     // mouse over a , b displays 
     // mouse out a , not over b ,2seconds b hide 
     // mouse out a , over b , b don't hide 
     // mouse out b , not over a, b, 2seconds b hide 
    }); 
</script> 
<style type="text/css"> 
    *{margin:0;padding:0} 
    .page{padding:60px;} 
    .a{background-color:tan;width:50px;height:50px;color:#fff} 
    .b{background-color:#9E0606;width:100px;height:100px;color:#fff} 
</style> 
<div class="page"> 
    <div class="a">a</div> 
    <div class="b">b</div> 
</div> 
+2

당신은 몇 가지 코드를 작성을 시도하여 목표를 달성 할 수보십시오. –

+0

a에서 호버 기능을 사용하려고 시도하지만 a 및 b로 b를 숨길 수 없음 –

+0

b를 입력하면 쉽게 사용할 수 있습니다. – epascarello

답변

0

var tOut; 
$('.a,.b').hover(function() { 
    $('.b').show(); 
    clearTimeout(tOut); 
}, function() { 
    tOut = setTimeout(function() { 
     $('.b').hide(); 
    }, 2000); 
}); 

DEMO

+0

시도, b 밖으로 b, 2 초 안에 숨길 것입니다, 내가 b 숨기기를 원하지 않는다면 –

+1

위의 마우스가 좋을 때,이 코드는 완벽합니다. 감사합니다. 대단히 감사합니다. –

+0

@downvoter 왜? – Anton

0
var onOut; 
$('.a').hover(function() { 
    $('.b').show(); 
    clearTimeout(onOut); 
}, function() { 
    onOut = setTimeout(function() { 
     $('.b').hide(); 
    }, 2000); 
}); 
관련 문제