Jquery Div向下滑动并反弹动画效果

时间:2014-03-08 17:36:39

标签: jquery

我正在尝试结合两个jquery show效果:bounce和slidingown。

我原来的下拉动画如下:

$('#mydiv').slideDown( 100, function() {});

和反弹动画

( "bounce", { times: 3 }, "slow" );

当你点击上传照片时,我希望div滑下来并像Tumblr那样反弹

1 个答案:

答案 0 :(得分:0)

你想要的东西可以通过队列轻松完成......

<script>
$( "#show" ).click(function() {
  var n = jQuery.queue( $( "div" )[ 0 ], "fx" );
  $( "span" ).text( "Queue length is: " + n.length );
});

function runIt() {
  $( "div" )
    .show( "slow" )
    .animate({
      left: "+=200"
    }, 2000 )
    .slideToggle( 1000 )
    .slideToggle( "fast" )
    .animate({
      left: "-=200"
    }, 1500 )
    .hide( "slow" )
    .show( 1200 )
    .slideUp( "normal", runIt );
}

runIt();
</script>

上面的内容......从下面的链接中复制。

http://api.jquery.com/jquery.queue/