問題タブ [jquery-ui-resizable]

以下の div はドラッグ可能で、JQuery を使用してサイズ変更可能です。サイズ変更された div に基づいて内側のテキストのサイズを自動的に変更したいです。

私はJqueryを使用してフォローしていますが、どういうわけか、サイズ変更アイコンが表示されている右下隅にサイズを変更できます。サイドエッジにはサイズ変更のために<->が表示されますが、エッジからサイズ変更するために伸ばすことができませんか？何が問題なのですか？

jQuery UIを使用してページ要素のサイズを変更できるようにしていますが、カスタムハンドルを設定したいと思います。うまくいくと思うことを試しましたが、うまくいきません。

基本的なhtmlは次のとおりです。

私はそれを次のように設定しました：

これにより、適切な場所に正しいハンドルが生成されますが、サイズを変更しようとしても、何も実行されません。何が間違っているのでしょうか、それともこれを行うためのより良い方法がありますか？

さまざまなdivのサイズを変更するために、JqueryUIのサイズ変更可能なプラグインを利用しています。次のHTMLページ（JSが埋め込まれている）について考えてみます。

したがって、このサンプルコードで達成しようとしていることは非常に単純です。ユーザーが「#site」内にネストされたdivをクリックすると、そのdivが「選択済み」になります。したがって、この例では、divのクリックイベントが発生すると、「selected」というCSSクラスがクリックされたdivに追加されます。divをクリックするだけでなく、ユーザーはdivのサイズを変更できます。この問題は、ユーザーが選択したdivのサイズを変更したときに発生します。明らかに、クリックイベントは、ユーザーが最初にdivを選択したときに発生しますが、クリックイベントは、ユーザーがdivの端をクリックしてドラッグしてサイズを変更したときにも発生します。クリックイベントはクリックルーチンを呼び出し、divの選択を解除します。これは私がしたいことではありません。クリックイベントは、サイズ変更可能なすべてのイベントが発生した後にのみ発生します。

それで、私の質問は、ユーザーがdivをクリックして選択できるようにするだけでなく、divのサイズを変更できるが、divをドラッグしてサイズ変更したときに選択を解除できないようにするには、このシナリオをどのように処理できるかということです。あなたの助けに感謝します。前もって感謝します。

JQuery UI を使用して、div のサイズを垂直方向にのみ変更しています (下端からドラッグします。div のheight:200pxとoverflow:autoを設定します。

JQuery は次のようになります。

サイズ変更機能は、div が空であるか、コンテンツはあるがオーバーフローがない場合にうまく機能します。ただし、オーバーフローがある場合は、スクロール バーを下に移動すると、ドラッグ ハンドルが (下から) ずれて上に移動します。下端にとどまらず、使用できなくなるため、私は夢中になります。

これを修正する方法がわかりません。誰か助けてくれませんか？

ありがとうございました！

HTML:

jQuery UIに似た WPF ライブラリはありますか?

Sortableインタラクションが特に気に入っています。

およびサイズ変更可能な相互作用:

この 2 つの相互作用を組み合わせることができれば素晴らしいことです。

ありがとう。

現在、次のページで作業しています。

divResizable は、次のコードを使用して jQuery によって変更されています。$().ready()

ご覧のとおり、divResizable が小さくなると divContent の幅を広げようとします。ただし、このコードでは、divContent は常に左側だけに「成長」するとは限りません。時には、無関係な div の右側に拡張されることがあります。

これらの 2 つの div の幅を一致させるためのより洗練された方法への入力はありますか?

私が考えることができるのは、divContent の幅を

jQueryを使用してこれをどのように正確に行うのですか?

次のコードがあります

ip 要素のサイズを変更すると、要素が少し左に移動します y?

デモはこちらデモ

Jフィドルを参照してください：

http://jsfiddle.net/NwvPA/3/

2つのバーは、左右にのみサイズ変更できます。ただし、一番上のバーのサイズを変更すると、もう一方のバーがその上に再配置され、垂直レベルのままになります。

かなりたくさんあるので、ここにコードを投稿するのは難しいです。関連するすべてのビットが取り除かれ、フィドルに置かれます。

助けてくれてありがとう！

次のスクリプトがあります。

http://jsfiddle.net/rYFEY/12/

右と右下のハンドルを削除する必要があることを除いて、これはうまく機能します。サイズ変更のために下のハンドルのみを残します。現在、右側のハンドルをクリックすると、ボックスのサイズが変わります。

常に 100% の幅を維持し、高さのみをサイズ変更可能にする必要があります。

これはどのように行うことができますか？