This is a basic as you get. To resize the box, position your mouse anywhere near the bottom, right or bottom right edge of the box. This example uses the default "floating" handles.

リサイズ可能なブロック要素をページに作る為のJavaScript コンポーネント。
次のように、ブロック要素にリサイズハンドルを付けることができ、画像をその場でリサイズできます。
小さい画像を置いておいて、利用者が自由にリサイズするようなＵＩが実現出来ます。


Yahoo UI Library を使っていて、次のように簡単に実装できるようです。

var dwrapped = new YAHOO.ext.Resizable('dwrapped', {
    wrap:true,
    pinned:true,
    width:450,
    height:150,
    minWidth:200,
    minHeight: 50,
    dynamic: true
});

パラメータを調整することで、次のようなリサイズ可能なポップアップ画像を表示させたりすることが出来ます。



リサイズをアニメーションするような機能もあってなかなか楽しいライブラリです。
WEB上で、写真を散らかせて置いておくようなWEBアルバムっぽい感じのアプリケーションが作れそうですね。

JavaScript ライブラリ関連エントリ

• Visioのような図が書けるJavaScriptライブラリ「Open-jACOB Draw2D 」
• 単体で使えるJavaScriptカラーピッカー「DHTML Color Picker」
• 独自デザインのSelectボックスを作成するJavaScriptライブラリ「Custom SelectBox」
• Ajax等のレスポンスをキャッシュするJavaScriptライブラリ「JSOC」
• JavaScriptアニメーションフレームワークライブラリ「Run」