Javascript slidedown悬停LI

时间:2011-05-08 09:04:50

标签: javascript jquery jquery-hover

我在悬停LI时遇到问题,他将所有的li而不是我悬停的那个悬停。

HTML:

<div id="lista">
      <ul>
        <li>
             <a href="#">content1</a>
           <div class="slide">hide content1</div>
        </li
       <li>
             <a href="#">content2</a>
           <div class="slide">hide content2</div>
        </li>
      </ul>

    </div>

的javascript:

$('#lista li ').hover(function () {
$('.slide').slideDown('slow');
}, function () {
$('.slide').slideUp('fast');
});
});

2 个答案:

答案 0 :(得分:2)

$('#lista li ').hover(
    function () {
        $(this).children('.slide').slideDown('slow');
    },
    function () {
       $(this).children('.slide').slideDown('slow');
    }
);

说明:每次悬停#lista li元素时,都必须引用其子.slide元素。如果您只是执行$('。slide'),则表示您指的是整个文档中的每个.slide元素;)

答案 1 :(得分:0)

尝试使用.mouseover代替.hover