簡單的寬度/高度和左/頂位置的變換（縮放）

我有一個需要旋轉畫布的網站，畫布包含不同的圖像。我正在使用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

簡單的寬度/高度和左/頂位置的變換（縮放）

回答

相關問題