2013-10-10 144 views
0

我需要使用javascript移動/縮放/歪斜圖像(或文本)。我知道如何使用CSS3來做到這一點,但所有這些操作都應該是動態的並且帶有控件。就像這樣:圖像縮放/移動/歪斜控制

enter image description here

我發現fabricjs

但我也需要行動歪斜

任何JS庫/ exapmle可以做到這一點?

+0

有歪斜與canvas元素本身翻譯可用,但可能需要您從頭開始編寫所有的邏輯,除非庫允許你插入自己的代碼到管道線(我不熟悉圖書館,所以我不能告訴)。 – K3N

+0

只有純粹的JavaScript或jQuery插件才能做到呢? – VJS

+0

@Ken我知道畫布歪斜,但我需要控制這個動作。用戶應該能夠使用鼠標實時傾斜圖像:) – tuchk4

回答

0

檢查的jQuery插件:

jquery.transit

用法似乎很簡單。

$('.box').transition({ rotate: '45deg' }); 
$('.box').transition({ scale: 2.2 }); 
$('.box').transition({ skewX: '30deg' }); 
$('.box').transition({ x: 40, y: 40 }); 
+0

是的,它很簡單,但它只提供了改變對象的方法,只能使用CSS3規則。但是這樣我需要實現控件(控件 - 我的意思是這個小方塊http://i.stack.imgur.com/ZbhEe.png) – tuchk4

+0

代替方塊可以是你的文本或任何div。$ (「#div_id」)。transition({skewX:'30deg'}); – VJS