在.show期间jQuery动画高度(' slide')

时间:2013-12-14 00:18:49

标签: javascript jquery html css

我想知道是否有人可以帮我这个: http://jsfiddle.net/jalxob/wMck2/7/

$(".turn_next").click(function(){
   $(".box2").hide();
   $(".box3").animate({height:'300px'}, 300);
   $(".box3").show('slide', {direction: 'right'}, 500);
});

$(".turn_back").click(function(){
   $(".box3").hide();
   $(".box2").animate({height:'100px'}, 300);
   $(".box2").show('slide', {direction: 'left'}, 500);
});

我希望在box2(红色的)和box3(黄色的)之间的幻灯片转换之前,用户可以看到高度动画,因为两者的高度不同。

有什么想法吗?

谢谢你们!

1 个答案:

答案 0 :(得分:0)

你需要这个吗?

$(".turn_next").click(function(){
   $(".box2").hide();
   $(".box1_content").animate({height:'300px'}, 300,function(){
         $(".box3").show('slide', {direction: 'right'}, 500);
   });
});

$(".turn_back").click(function(){
   $(".box3").hide();
   $(".box1_content").animate({height:'100px'}, 300,function(){
       $(".box2").show('slide', {direction: 'left'}, 500);
   });
});

DEMO