web技术


我想在对图片进行扩大时，图片是居中等比例缩放和扩大。不进行偏移，怎么解决，就是对坐标进行从新定位。
代码：
$('#rightImg').click(function() {
     $('.viewer img').css('left','500px');
     var vali = $('#left').css('display');
     //$(".main .jCarouselLite").css('width','1200px');
      //如果左侧是显示的，则左侧全屏显示
     if(vali == 'block') {        
     $('#td1').show();
     $('#td3').hide();
     $('#td2').show();
     $('#right').hide();           
     $('#td2').css({'margin-left':'99%','margin-right':'0'});
     $('#td1').css({'width':'99%','margin-right':'1%','height':'100%'});     
     var tabWidth =$(window).width()*0.99;
     $('#conTab').css('width',tabWidth);
     var tt = $('#conTab').find('td:eq(1)').width();
     var test = tabWidth*0.5-tt*0.5;
     $('.wrapper').css({'position': 'absolute','width':tt,'left':test});  
     /*****************大图位置***************************/  
    $('#viewer').find('img').each(function() {
    var marVal = tt/2-$(this).width()/2;
      $(this).css('left',marVal);
    });
    /**************大小图片按钮**********************/
    var start = '';
  var end = '';
  $('.iviewer_common').each(function(n) {
  if(n == 0) {
  var test = $(this).css('left');
  start = test.split('p')[0];
  }
  if( n == (cunt-1)) {
  var test = $(this).css('left');
  end = test.split('p')[0];
  }
  });
  var rot = $('.iviewer_rotate_right').width();
     var marValue = ($(window).width())*0.99*0.8/2-(end-start+rot)/2;
   $('.iviewer_common').css('margin-left',marValue);      
 } else {//这时候还原到原先的样式 
     $('#td1').show();
     $('#td2').show();
     $('#td3').show();
     $('#leftImg').show();
     $('#rightImg').show();
     $('#left').show();
     $('#right').show();
     $('#td1').css({'width':'70%','margin-left':'0','height':'100%'});
     $('#td2').css({'margin-right': '29%','margin-left': '70%'});
     $('#left').css({'width':'100%','margin-right':'0','height':'100%'});
     $('#td3').css({'width':'29%','margin-right':'0','height':'100%'});    
     $('#conTab').css('width',conTabWidth);
     var leftVal = $(window).width()*0.1;     
     $('.wrapper').css({'position': 'absolute','width':orgWidth,'left':leftVal});       
     /*****************大图位置***************************/  
     var tt = $('#conTab').find('td:eq(1)').width(); 
    $('#viewer').find('img').each(function() {
      var marVal = tt/2-$(this).width()/2;
      $(this).css('left',marVal);
    }); 
    /**************大小图片按钮**********************/
     var marValue = ($(window).width())*0.7*0.7/2-(end-start+rot)/2;
   $('.iviewer_common').css('margin-left',marValue);        
     }
 });  
  var cunt = $('.iviewer_common').size();
   var start = '';
  var end = '';
  $('.iviewer_common').each(function(n) {
  if(n == 0) {
  var test = $(this).css('left');
  start = test.split('p')[0];
  }
  if( n == (cunt-1)) {
  var test = $(this).css('left');
  end = test.split('p')[0];
  }
  });
  var rot = $('.iviewer_rotate_right').width();
   var marValue = ($(window).width())*0.7*0.7/2-(end-start+rot)/2;
   $('.iviewer_common').css('margin-left',marValue);      
});Web图片技术