简单的宽度/高度和左/顶位置的变换（缩放）

我有一个需要旋转画布的网站，画布包含不同的图像。我正在使用jQuery。 A的非常好的例子可以在http://www.polyvore.com/cgi/app 发现，我需要acheive相同的功能（拖动一个项目，然后点击放大）简单的宽度/高度和左/顶位置的变换（缩放）

对于每一个象限它扩展了图像并将其移动到基于各自的位置画布的中心。

任何人都可以帮助我吗？

这是我的变焦功能的代码片段，它基本上扔迭代每个元素在画布上，并调整其大小，但我不知道如何改变基于象限的位置和可能是什么公式

zoomFactor=4; 

function zoomin() 
{ 

$('.ui-resizable').each(function(){ 

      var currWidth=$(".ui-draggable img",$(this)).width(); 
      var currHeight=$(".ui-draggable img",$(this)).height(); 

      var index=get_current_index($(this).attr('id')); 

$(".ui-draggable img",$(this)).width(currWidth+parseInt(width[index]/zoomFactor)); 

$(".ui-draggable img",$(this)).height(currHeight+parseInt(height[index]/zoomFactor)); 
      $(this).width(currWidth+parseInt(width[index]/zoomFactor)); 
      $(this).height(currHeight+parseInt(height[index]/zoomFactor)); 





     }); 

}

来源

2011-11-24 Fahad Abbasi

开始思考一个简单的例子。假设我们有一个以x，y =（200,200）和图像宽度，高度=（50,50）为中心的图像，左上角应该在175,175处。现在放大新的窗口后，高度为100 ，100意味着你在50和50中增加了50个。要保持中心仍然在（200,200），您需要将左上角移至150,150。所以我们要做的是：

left = newWidth/2 - center and top = newHeight/2 -center。

类似地缩小式应该是

左= newWidth/2 +中心和顶部= newHeight/2 +中心。

来源

2011-12-02 06:36:18

简单的宽度/高度和左/顶位置的变换（缩放）

回答

相关问题