单击执行某个操作，然后加载页面

Question

我正在寻找一个执行以下操作的脚本：

我有一个高度为200px的横幅，在该横幅下面我有几个链接。 当我点击其中一个链接（假设使用class =“link-one”）时，首先让横幅动画为0px高度，然后ajax加载横幅高度为0的新页面，然后设置为200px高度的动画。

也许使用ajax有点困难，我可以保留这部分，所以加载新页面做动画，加载后新页面做动画。

Answer 1

//example from flicker, can be any ajax call
var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";

$("#banner").click(function() {
    $(this).animate({height:"toggle"},5000,function() { //height:toggle changes the height to 0, the bak to the original height

        $.getJSON( flickerAPI, {
        tags: "mount rainier",
        tagmode: "any",
        format: "json"
        }).done(function( data ) {
            $("#banner").animate({height:"toggle"},5000,function() {
                alert("done")        
            });
         });
    });
});