css縮放（-webkit轉換）div和它的孩子與jquery ui可拖動移動不同於光標在拖動

我有一個窗口裏面有一個孩子。孩子應該在窗戶內移動。窗口使用css變換（-webkit-transform）進行縮放。我想是這樣的：css縮放（-webkit轉換）div和它的孩子與jquery ui可拖動移動不同於光標在拖動

html 
<div class="window"> 
    <div class="rect"></div> 
</div> 

css 
.window 
{ 
    width: 640px; 
    height: 480px; 
    background: gray; 
    position: absolute; 
    -webkit-transform: translate(-25%, -25%) scale(0.5); 
} 

.rect 
{ 
    width: 60px; 
    height: 40px; 
    background: red; 
} 

js 
$(function() { 
    $('.rect').draggable({ 
     containment: 'parent' 
    }); 
});

我在這裏貼吧 - http://jsfiddle.net/bLKQj/12/ 孩子比光標移動緩慢。如果縮放比例大於1，則會移動得更快。如何解決它？

PS：在變換translate(-25%, -25%)是用於使固定的左上角縮放。

來源

2012-07-14 DmT021

[jQuery拖動/調整大小與CSS轉換縮放]的可能重複（http://stackoverflow.com/questions/10212683/jquery-drag-result-with-css-transform-scale） – 2012-07-15 09:15:34

要修改您的中心轉換，最好使用轉換原點而不是轉換：'-webkit-transform-origin：0;/*將從左上角* /'變換。 – 2012-07-20 10:34:13

我會說爲什麼你需要使用CSS轉換？你應該儘可能避免它們，因爲它們沒有得到很好的支持，並且它們有這樣的意想不到的後果。你能指定不同的高度和寬度嗎？

來源

2013-10-04 02:25:04 russtuck91

css縮放（-webkit轉換）div和它的孩子與jquery ui可拖動移動不同於光標在拖動

回答

相關問題