Question

我创建了一个简单的下拉菜单，在a标签悬停时显示ul。但是，随着一些电子书标题返回2个列表，这证明是一个痛苦，因为当一个人正在徘徊时，他们都会得到悬停状态。我听说使用“this”会选择我正在徘徊的那个，但我不能完全正确。到目前为止，这只是当有一个电子书标题可用时很好用的。

<a class="button ebook-button" style="width: 150px;">Get the E-book ...</a>
<ul class='ebookRollover'>
    <li><a href='1'>1</a></li>
    <li><a href='2'>2</a></li>
    <li><a href='3'>3</a></li>
    <li><a href='4'>4</a></li>
    <li><a href='5'>5</a></li>
    <li><a href='6'>6</a></li>
</ul>
<a class="button ebook-button" style="width: 150px;">Get the E-book ...</a>
<ul class='ebookRollover'>
    <li><a href='1'>1</a></li>
    <li><a href='2'>2</a></li>
    <li><a href='3'>3</a></li>
    <li><a href='4'>4</a></li>
    <li><a href='5'>5</a></li>
    <li><a href='6'>6</a></li>
</ul>


<script type="text/javascript">
    $('.ebook-button').parent().css('padding-bottom', '0');
    $('.ebookRollover').hide()
    $('.ebook-button, .ebookRollover').mouseenter(function(){
        $('.ebookRollover').show()
        $('.ebook-button').addClass('active');
    });
    $('.ebook-button, .ebookRollover').mouseleave(function(){
        $('.ebookRollover').hide();
        $('.ebook-button').removeClass('active');
    });
</script>

具有相同类的下拉菜单

0 个答案: