jQuery:Hover上的Slidedown li和滑出时的SlideUp

新用户

我怎样才能做到这一点的jQuery。当鼠标悬停在产品1上时,仅向下滑动此类别上的元素,例如:

项目1项目2项目3项目4

当鼠标离开产品1时,会向上滑动。与其他人一样

<div>
<li>Product1</li>
        <ul>
        <li>Item1</li>
        <li>Item2</li>
        <li>Item3</li>
        <li>Item4</li>
        </ul>
<li>Product 2</li>
        <ul>
        <li>Item product 2</li>
        <li>Item product 2</li>
        <li>Item product 2</li>
        </ul>
<li>Product 3</li>
        <ul>
        <li>Item product 2</li>
        <li>Item product 2/li>
        </ul>

</ul>
</div>
达蒙

检查您的标记-我认为这是不对的。那会帮助很多时间。另外,我将其更改为将produt1用作锚标记或其他内容-只是一些内容,以给用户留下他们可以使用该元素执行操作的印象。

这是一个jsFiddle

的CSS

ul li ul {
    display: none;
}

jQuery的

$('ul li a').hover(function(event){
    $(this).next('ul').slideToggle('fast', function(){
    // Done.
    });
    event.preventDefault();
});

您也可以更改.hover使用.click或其他事件。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

jQuery: Slidedown li on Hover and SlideUp on mouse out

来自分类Dev

slideUp和slideDown jQuery

来自分类Dev

在jQuery中的replaceWith上添加SlideUp和Slidedown动画

来自分类Dev

jQuery-mouseenter上的slideDown>延迟> mouseleave上的SlideUp

来自分类Dev

jQuery-mouseenter上的slideDown>延迟> mouseleave上的SlideUp

来自分类Dev

单击单选按钮时的jQuery slidedown()slideup()

来自分类Dev

同级div slideDown时的jQuery slideUp

来自分类Dev

jQuery Slidedown和Slideup摆动div

来自分类Dev

如何使用jQuery slidedown和slideup

来自分类Dev

jQuery:下拉导航slideDown和slideUp

来自分类Dev

jQuery slideDown,slideUp摇摆

来自分类Dev

jQuery SlideDown,slideUp

来自分类Dev

jQuery slideDown,slideUp摇摆

来自分类Dev

slideDown和slideUp问题

来自分类Dev

jQuery fadeOut和SlideUp,然后fadeIn和SlideDown

来自分类Dev

jQuery fadeOut和SlideUp,然后fadeIn和SlideDown

来自分类Dev

jQuery slideUp / slideDown不动画

来自分类Dev

JS SlideUp和SlideDown在表上无法正常工作

来自分类Dev

jQuery slideUp()和slideDown()函数在奇数时间触发

来自分类Dev

使用AngularJS和jQuery修改DOM(slideDown / slideUp)

来自分类Dev

jQuery slideUp和slideDown移动版的替代品

来自分类Dev

jQuery-在链中随机调用slideUp和slideDown

来自分类Dev

如何通过代码测试jquery .slideDown()和slideUp()?

来自分类Dev

slideDown,slideUp在jQuery中不起作用

来自分类Dev

jQuery slideUp()影响其他列表的slideDown()

来自分类Dev

jQuery toggle / slideDown / slideUp无法正常工作

来自分类Dev

将鼠标悬停在菜单上时,保持Jquery slideDown菜单处于打开状态?

来自分类Dev

jQuery v1.11和v2.1 slideUp和slideDown不尊重CSS显示属性

来自分类Dev

在条件中使用slideUp()和slideDown()

Related 相关文章

  1. 1

    jQuery: Slidedown li on Hover and SlideUp on mouse out

  2. 2

    slideUp和slideDown jQuery

  3. 3

    在jQuery中的replaceWith上添加SlideUp和Slidedown动画

  4. 4

    jQuery-mouseenter上的slideDown>延迟> mouseleave上的SlideUp

  5. 5

    jQuery-mouseenter上的slideDown>延迟> mouseleave上的SlideUp

  6. 6

    单击单选按钮时的jQuery slidedown()slideup()

  7. 7

    同级div slideDown时的jQuery slideUp

  8. 8

    jQuery Slidedown和Slideup摆动div

  9. 9

    如何使用jQuery slidedown和slideup

  10. 10

    jQuery:下拉导航slideDown和slideUp

  11. 11

    jQuery slideDown,slideUp摇摆

  12. 12

    jQuery SlideDown,slideUp

  13. 13

    jQuery slideDown,slideUp摇摆

  14. 14

    slideDown和slideUp问题

  15. 15

    jQuery fadeOut和SlideUp,然后fadeIn和SlideDown

  16. 16

    jQuery fadeOut和SlideUp,然后fadeIn和SlideDown

  17. 17

    jQuery slideUp / slideDown不动画

  18. 18

    JS SlideUp和SlideDown在表上无法正常工作

  19. 19

    jQuery slideUp()和slideDown()函数在奇数时间触发

  20. 20

    使用AngularJS和jQuery修改DOM(slideDown / slideUp)

  21. 21

    jQuery slideUp和slideDown移动版的替代品

  22. 22

    jQuery-在链中随机调用slideUp和slideDown

  23. 23

    如何通过代码测试jquery .slideDown()和slideUp()?

  24. 24

    slideDown,slideUp在jQuery中不起作用

  25. 25

    jQuery slideUp()影响其他列表的slideDown()

  26. 26

    jQuery toggle / slideDown / slideUp无法正常工作

  27. 27

    将鼠标悬停在菜单上时,保持Jquery slideDown菜单处于打开状态?

  28. 28

    jQuery v1.11和v2.1 slideUp和slideDown不尊重CSS显示属性

  29. 29

    在条件中使用slideUp()和slideDown()

热门标签

归档