動畫效果瀏覽相冊中的圖片

/**
 * Created by chenjing on 2015/12/01.
 */
$(function () {
    var curIndex = -1;
    var intImgL = '0px';
    var intImgT = '0px';
    $('.p_Lst').each(function (index) {
        var $this = $(this);
        var $img = $this.find('img');
        var $info = $this.find('.p_Alt');
        var arrPic = {};
        arrPic.imgw = $img.width()+50;
        arrPic.imgh = $img.height()+50;
        arrPic.orgw = $this.width();
        arrPic.orgh = $this.height();
        $img.css({
            marginLeft: intImgL,
            marginTop: intImgT
        });

        var $drag = $("<div class='p_Img'>").append($img).prependTo($this);
        var $open = $("<a href='javascript:void(0)' class='p_Big' title='點擊放大' style='float: left'></a><h6 class='h_Pig'>點擊放大</h6>").appendTo($this);
        var $clos = $("<a href='javascript:void(0)' class='p_Cls' title='點擊關閉'></a>").appendTo($info);

        arrPic.dragw = $drag.width();
        arrPic.dragh = $drag.height();

        $open.click(function () {
            $this.animate({
                width: arrPic.imgw,
                height: (arrPic.imgh + 35),
                borderWidth: "5"
            }, 1000);
            $open.fadeOut();
            $(".p_Alt", $this).fadeIn();
            $drag.animate({
                width: arrPic.imgw,
                height: arrPic.imgh
            }, 1000);
            $img.animate({
                marginTop: '0px',
                marginLeft: '0px',
                width: arrPic.imgw
            }, 1000);

            var $f_this = $('.p_Lst:eq(' + curIndex + ')');
            var $f_open = $('.p_Big:eq(' + curIndex + ')').after($('.h_Pig:eq('+curIndex+')').css('display','block'));
            var $f_drag = $('.p_Img:eq(' + curIndex + ')');
            var $f_larg = $('.p_Alt:eq(' + curIndex + ')');
            var $f_imgs = $('img:eq(' + curIndex + ')');

            if (curIndex != -1) {
                cls_Click($f_this, $f_open, $f_drag, $f_imgs, $f_larg);
            }
            curIndex = index;
        });


        $clos.click(function () {
            cls_Click($this, $open, $drag, $img, 1);
            curIndex = -1;
        });

        function cls_Click(pF, pO, pW, pI, blnS) {
            var $strInit;
            pF.animate({
                width: arrPic.orgw,
                height: arrPic.orgh,
                borderWidth: "1"
            }, 1000);
            pO.fadeIn();
            if (blnS) {
                $strInit = $('.p_Alt', pF);
            } else {
                $strInit = blnS;
            }
            $strInit.fadeOut();
            pW.animate({
                width: arrPic.dragw,
                height: arrPic.dragh
            }, 1000);
            pI.animate({
                marginTop: intImgT,
                marginLeft: intImgL,
                width: arrPic.imgw-50
            }, 1000);
        }
    });
})