在关闭后再次进入会出现图片跟随pop一起进入的动画,然后再瞬间消失,再以设定好的由小到大的动画入场

$(function(){
    //(function($){
    var container = $('.container');
    var box = $('.box');
    var buddy = $('.buddy');
    var inner = $('.inner');
    var pop = $('.pop');
    var close = $('.close');
    var open = $('.btn');
    var imgs = pop.find('img');
    //定义动画
    //高度变化入场动画
    $.Velocity.RegisterUI('lixin.slideUpIn',{
        defaultDuration: 500,
        calls: [
            //opacity:透明度,1:结束时的透明度,0:开始的
            //translateY:Y轴的高度变化
            [{opacity: [1,0],translateY: [0,100]}]
        ]
    });
    //高度变化出场动画
    $.Velocity.RegisterUI('lixin.slideDownOut',{
        defaultDuration: 300,
        calls: [
            [{opacity: [0,1],translateY: [100,0]}]
        ]
    });
    //大小变化的入场动画
    $.Velocity.RegisterUI('lixin.scaleIn',{
        defaultDuration: 300,
        calls: [
            //scale:大小变化,从0.3到1倍大小
            [{opacity: [1,0],scale: [1,0.3]}]
        ]
    });
    //大小变化的出场动画
    $.Velocity.RegisterUI('lixin.scaleOut',{
        defaultDuration: 300,
        calls: [
            //scale:大小变化,从0.3到1倍大小
            [{opacity: [0,1],scale: [0.3,]}]
        ]
    });
    var seqInit = [
        {
            elements: container,
            properties: 'lixin.slideUpIn',
            option: {
                delay: 300
            }
        },
        {
            elements: box,
            properties: 'lixin.slideUpIn',
            option: {
                sequenceQueue: false
            }
        }, {
            elements: buddy,
            properties: 'lixin.slideUpIn',
            option: {
                sequenceQueue: false,
                delay: 60
            }
        }
    ];
    var seqClick = [
        {
            elements: container,
            properties: 'lixin.slideDownOut'
        },{
            elements: box,
            properties: 'lixin.slideDownOut',
            option: {
                sequenceQueue: false
            }
        }, {
            elements: container,
            properties: 'lixin.slideUpIn'
        }, {
            elements: pop,
            properties: 'lixin.slideUpIn',
            option: {
                sequenceQueue: false
            }
        },{
            elements: imgs,
            properties: 'lixin.scaleIn'
        }
    ];
    var seqClose = [
        {
            elements: imgs,
            properties: 'lixin.scaleOut'
        },{
            elements: container,
            properties: 'lixin.slideDownOut'
        },{
            elements: pop,
            properties: 'lixin.slideDownOut',
            option: {
                sequenceQueue: false
            }
        }, {
            elements: container,
            properties: 'lixin.slideUpIn'
        }, {
            elements: box,
            properties: 'lixin.slideUpIn',
            option: {
                sequenceQueue: false
            }
        },{
            elements: imgs,
            properties: 'lixin.scaleIn'
        }
    ];
    $.Velocity.RunSequence(seqInit);
    open.on('click',function(){
        $.Velocity.RunSequence(seqClick);
    });
    close.on('click',function(){
        $.Velocity.RunSequence(seqClose);
    });
        //})(jQuery);
});