jquery - 想要放大我的 Jquery slider 中央图片

Question

您好，我正在使用 Jquery 制作照片 slider 。我的 slider 工作完美，但是我想放大我的 slider 中央图片，例如

通过添加 20px 的宽度和高度，使其看起来像 IOS 相册库。当您向右滑动时，它将使之前的中央图片恢复正常大小并放大新的中央图片。我在 => http://jsfiddle.net/jdDYQ/4/ 上做了我的 slider .

如果有人能告诉我如何制作我已经在上面的链接上开始的这个功能。谢谢？

JS

var index = 0;

$('.next').click(function(){
var photoWidth = parseInt($(".mf1_ui li:eq("+index+")").css("width"),10);
if(index != 0) photoWidth += 2;

console.log(photoWidth);
if(-(parseInt($(".mf1_ui").css("left"),10)) < (parseInt($(".mf1_ui").css("width"),10) -  288)){
    
  $( '.mf1_ui' ).animate({
      left: "-="+photoWidth+"px"
  }, {
      duration: 1000,
      queue : false,
      step: function( now, fx ){
      }
  });
 index++;  
}
});
 $('.previous').click(function(){
    var photoWidth = parseInt($(".mf1_ui li:eq("+(index -   1)+")").css("width"),10);
    if(index != 0) photoWidth += 2; 
    
    if(parseInt($(".mf1_ui").css("left"),10) <= 0){
      $( '.mf1_ui' ).animate({
        left: "+="+photoWidth+"px"
      }, {
        duration: 1000,
        queue : false,
        step: function( now, fx ){
        } 
      }); 
      index--;
    }
 });    

Answer 1

您好，我终于解决了 slider 的问题，现在滑动时中央图片会放大。问题是我无法将中央图片垂直居中。如果有人能告诉我如何将它垂直居中以产生 3D 效果。
我的 slider => http://jsfiddle.net/jdDYQ/7/

谢谢

.wrapper{
overflow: hidden;
position: relative;
width: 288px;
height:108px;
left: 100px;
top: 100px;
}
ul{
   position: relative;
   list-style: none;
   margin: 0;
   padding: 0;
   z-index: 1;
   float: left;
   height: 100px;
  }
li{
   float: left;
   height: 88px;
   padding: 2px 1px;
  }
ul li:first-child {
    padding-left: 0;
  }
 .previous{
  width:20px;
  height:20px;
  position: absolute;
  left:0px;
  top:38px;
  background-color:black;
  z-index: 2;
  cursor:pointer;    
}
.next{
width:20px;
height:20px;
position: absolute;
right:0px;
top:38px;
background-color:black;
z-index: 2;
cursor:pointer;
}