美文网首页
列表的slideDown与淡入效果对比

列表的slideDown与淡入效果对比

作者: 子却 | 来源:发表于2018-10-30 19:18 被阅读0次

对一个列表添加slideDown或fadeIn特效,其结果会根据不同元素、不同方式而有所变化。

<ul>
    <li>Tom</li>
    <li>Lily</li>
    <li>Nancy</li>
</ul>    
<script>
    $(function(){
        <!--$("ul").hide().delay(1000).slideDown(2000);-->
        <!--$("li").hide().delay(1000).slideDown(2000);-->
        $("li").hide().delay(1000).fadeIn(2000);
        })
    })
</script>

对<ul>添加特效

给<ul>添加slideDown特效后,<li>会依次展开,不会一起展开(因为slideDown特效是从头部开始展出的,所以会有依次展开的效果)。但为其添加了fadeIn特效后,各<li>会一起淡入。

对<li>添加特效

不管给<li>添加何种特效,它们都会一起展开。

相关文章

  • 列表的slideDown与淡入效果对比

    对一个列表添加slideDown或fadeIn特效,其结果会根据不同元素、不同方式而有所变化。 对

      添加特效...

    • 查漏补缺(一)

      css3的动态属性,比如:下拉列表的淡入淡出效果; vue框架的了解与实战; 前端必备技能:node.js。 注:...

    • jquery6

      jquery特殊效果: fadeIn() 淡入 fadeOut() 淡出 fadeToggle() 切换淡入...

    • vue实现切换页面效果

      *****淡入淡出效果 *****右侧滑出 *****右侧缓慢滑出加淡入

    • 2019-04-10

      jquery 特殊效果 slideup 上展 slidedown下展 slideToggle 切换 jquery ...

    • 图片切换淡入淡出效果「ImageSwitcher无法显示完成图片

      项目源码地址,实现效果 创建MyImageSwitcher 直入主题,我们想要实现图片的淡入,淡入效果,第一反应就...

    • 进行交互或动画时如何选择Visibility, Display,

      创建淡入/淡出效果 例如,创建淡入/淡出效果 在 Web 前端开发中,我们可以使用display, opacity...

    • 项目-namelist

      该姓名列表想要实现的功能是:列表展开时有个slideDown特效,且单击名字会淡出。在给列表添加特效时出现了一个小...

    • jQuery-淡入

      jquery特殊效果 fadeIn() 淡入 fadeOut() 淡出fadeToggle() 切换淡入淡出hid...

    • jQuery进阶

      1. jQuery特殊效果 fadeIn() 淡入 fadeOut() 淡出fadeToggle() 切换淡入淡出...

网友评论

      本文标题:列表的slideDown与淡入效果对比

      本文链接:https://www.haomeiwen.com/subject/qdqntqtx.html