jquery - 移動可能でサイズ変更可能なdiv、それを使用してサイズ変更する子div？

Question

さて、私は文字通り「マイコンピュータ」ウィンドウを純粋にCSS3から作成しました。完成させます。やりたいのは、移動してウィンドウのサイズを変更することです。

子クラスの中には、幅のサイズを変更したいだけのものもあれば、幅と高さのサイズを変更したいものもあります。それはかなりの作業のように思えます、そして私は実際にdivの移動についてもっと心配しています。私はそれを数回試してみましたが、うまくいきません！

誰かが私を助けることができますか？多分それのJFiddleは機能していますか？みんなありがとう！

編集：これがサイトです、ごめんなさい！：

ソースを見る、それはすべてそこにあります！

score 2 · Accepted Answer

http://jqueryui.com/demos/resizable/およびhttp://jqueryui.com/demos/draggable/を調べましたか？私はあなたがそれらの2つといくつかのカスタムコードの間であなたが望む機能を得ることができると想像します。

私はちょうどjfiddleであなたのコードを見て、これを置きました：

$(function() {
    $( ".window" ).draggable().resizable();
});

ドラッグ可能にするためにうまく機能しました。ある程度サイズ変更もしました。サイズ変更をより適切に機能させるには、ピクセルサイズではなく、ウィンドウの子要素に相対サイズ（100％など）を指定するのが最適です。

それがお役に立てば幸いです。もしそうなら、答えとしてマークしてください。

score 1 · Accepted Answer

JQueryでインターフェース要素を使用することを検討してください

これがデモのリストです。

特にあなたはこれを見たいかもしれません

インターフェイスプラグインの他のものは、これを好きになるのに役立ちます（スクロールを実装する場合）

しかし、JQueryのインターフェースプラグインを試してみてください。私の意見では非常に便利です。

score 0 · Accepted Answer

私はロバートと一緒にいます。CSSが物事を動的にする能力を持っているかどうかはわかりません。この場合、解決策はJavascriptまたは提案された（そしてはるかに単純な）jqueryです。

私は誤解される可能性がありますが、javascript（おそらくjqueryも）が何をしたいのかを正確に特定するには、「id」属性を使用する必要があると思います。

<div class="window" id="window_main">

次に、jquery関数を使用するときに、ドラッグ品質を「window_main」に適用できます。

お役に立てば幸いです。

幸運を！

score 0 · Accepted Answer

http://jsfiddle.net/Sc2Qm/1/で作業例を確認してください

.window現在、サイズ変更可能は、HTMLとCSSのレイアウト方法が原因でのみサイズ変更されます。