2012-04-04 17 views
1

コードで問題を説明するためにjsFiddle hereを作成しました(ピンクの要素をダブルクリックし、青い枠の外にドラッグして再度ダブルクリックして結果を比較してください)。jQuery UI - 回転時にドラッグ可能な要素がゆるむ

問題:私はCSSの制約を持つドラッグ可能な要素上で回転させる場合には、予想通り

、制約は動作しません。ドラッグ可能な要素は、部分的にコンテナの外にドラッグできます。私の推測では、CSSの回転方法とは関係がありますが、わかりません。

この問題を解決する方法はありますか?

答えて

2

CSSで回転を適用しても、タグの幅と高さは変更されないようです。そのため、ブラウザではタグのサイズ(および制限値)が変更されないため、divを外部に移動することができます。 divを調べるだけでそれを見ることができます。

cssクラスを切り替えるたびに、手動で幅と高さを認識したり、動的に計算したりすることができます。

See this post similar to your question

編集

私はあなたが欲しいものを行うための解決策を見つけました。トリックは、コンテナdivをドラッグ可能なアイテムとして使用し、子divのローテーションを管理することです。次に、子供の上/左のプロパティを調整する必要があります。 私はより良い公式を検索せず、単純に固定値を適用しました。しかし、それがうまくいくかどうかを見るだけでした。

このヘルプが欲しいです。

http://jsfiddle.net/Sp6qa/2/

+0

回転は、私は新しい幅と高さを計算するためにいくつかのアップデートで再びコードをしようとしたとき、予想通り、それはまだ動作しませんでしたので、非常に特別であるように思わします。http:// jsfiddle.net/Sp6qa/1/ – Magnus

+0

私は(おそらくベストではない)うまくいくソリューションを見つけました。私の編集をチェックし、あなたのニーズに合っているかどうかを教えてください。 – Mordhak

+0

今のところ最高のソリューションのようです! – Magnus

関連する問題