Ebeveynin fare vurgusu üzerinde chid div göster - javascript gerektirir?

Question

Ebeveyninin üzerine yerleştiğinizde bir div göstermem gerekir (varsayılan değer alt öğenin gizli kalması içindir). Bunu javascript ile yapmanın tek yolu var mı? Teşekkürler

Answer 1

JS gerektirmez.

HTML

<div class="parent"> 
    <p>Hello, I'm a child...</p> 
    <p class="hidden">..and so am I but I'm hidden.</p> 
</div> 

CSS

.hidden { display:none; } 
.parent:hover .hidden { display:block; } 

Answer 2

Eğer üst div bir mouseover etkinlik ekleyebilmek için jQuery kullanarak ve show çocuk div. Örnek olarak this fiddle'a bakın. kesinlikle jQuery ile

Answer 3

:

$("#some_parent").hover(function() 
{ 
    $(this).children("#some_child_div").show(); 
}); 

Answer 4

@jdln; evet

css:

.outer { 
    background:red; 
    height:100px; 
} 
.box1 { 
    background:blue; 
    height:100px; 
    width:80px; 
    display:none; 
} 
.outer:hover .box1{ 
    display:block; 
    cursor:pointer; 
} 

onay keman: http://jsfiddle.net/sandeep/XLTV3/1/

Answer 5

Eğer javascript gerekmez bir alt öğe olduğu için. İşte bir example.

Answer 6

İlk başta yukarıdaki css çözümünü kullanıyordum, ancak jQuery kullanmalıydım çünkü çocuk div'umda vurgunun titremesine neden olan bir görüntü var. MouseEnter üzerinde (masaüstü ekran boyutu varsa) ve mouseLeave üzerinde gizleyerek ama sadece şimdi ana sayfa konteyner üzerine gelerek titremeyi en aza indirmek için, ebeveyn üzerine gelindiğinde Burada çocuğu görüntülüyorsak:

$(document).ready(function() { 
    $(".parent-qtip").mouseenter(function() { 
     if ($(window).width()>=1200) 
      $(this).children(".child-qtip").show(); 
    }); 
    $(".parent-qtip").mouseleave(function() { 
     if ($('.page-content').find('.container:hover').length) 
      $('.child-qtip').hide(); 
    }); 
}); 

[saf css üzerine gelindikten