您好,欢迎来到二三娱乐。
搜索
您的当前位置:首页总结用于交互的四个动画方法

总结用于交互的四个动画方法

来源:二三娱乐

toggle

toggle(speed,[callback])

切换元素的可见状态。如果元素可见,切换为隐藏;隐藏则切换为可见。 例子如下:

$("#btn").click(function(){
                $(this).next().toggle()
            })
代码演示

在1.9版本以下的jQuery中,相当于

            $("#btn").toggle(function(){
                $(this).next().hide()
            },
            function(){
                $(this).next().show()
            })

slidToggle

slideToggle(speed,[casing],[callback])

通过高度变化来切换匹配元素的可见性。这个动画效果只调整元素的高度。如下例:

$("#btn").click(function(){
                $(this).next().slideToggle()
            })
代码演示

在1.9版本以下的jQuery中,相当于

            $("#btn").toggle(function(){
                $(this).next().slideUp()
            },
            function(){
                $(this).next().slideDown()
            })

fadeTo

fadeTo(speed,opacity,[callback])

把元素的不透明度以渐进方式调整到指定的值,只调整元素的不透明度,高度和宽度不发生变化。示例如下:

$("#btn").click(function(){
                $(this).next().fadeTo(600,0)
            })
代码演示
fadeToggle(speed,[easing],[callback])

通过不透明度变化来切换匹配元素的可见性,只调整元素的不透明度。示例如下:

$("#btn").click(function(){
                $(this).next().fadeToggle()
            })
代码演示

在1.9版本以下的jQuery中,相当于

            $("#btn").toggle(function(){
                $(this).next().fadeIn()
            },
            function(){
                $(this).next().fadeOut()
            })

Copyright © 2019- yule263.com 版权所有 湘ICP备2023023988号-1

违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务