Question

我一直试图制作一个代码，当一个div包含一个包含描述的div时，将其悬停在其父li上，但它只是不起作用..

我几乎可以肯定它与结构或css有关。

jQuery的：

$('.featured_entry li').hover(function() {
   $(this).find('.description').show(100); 
}, function() {
   $(this).find('.description').hide(100);
});

HTML：

<div class="featured_entry">
<ul>
    <li>
        <div class="description">blabalbla</div>
        <div class="box"></div>
    </li>
</ul>    
</div>

CSS：

.box {
    width: 200px;
    height: 200px;
    background: #000;
}

.description {
    background: #142450;
    width: 200px;
    height: 100px;

    display: none;
}

http://jsfiddle.net/Wy3wW/9/

Answer 1

http://jsfiddle.net/Wy3wW/10/

这是有效的。你忘了添加jquery库。你只需要添加： <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

到您的文件

以及.ready功能：

$(document).ready(function(){ /* jquery code */ });

Answer 2

您可能需要延迟执行，直到加载DOM：

$(function(){
    $('.featured_entry li').hover(function() {
         $(this).find('.description').show(100); 
         }, function() {
            $(this).find('.description').hide(100);
     });
});

悬停功能不想工作

2 个答案: