オブジェクトのサイズを変更する

jQuery JavaScript 
<html>
<head>
<link rel="stylesheet" href="css/jquery-ui-1.7.2.custom.css" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript">
//<![CDATA[
	$(function() {
		//初期サイズを取得
		$('#sizedata').text('width:' + $('#resizeobject').width() + ' / height:' + $('#resizeobject').height());
		//jQueryUIのresizable関数
		$('#resizeobject').resizable({
			resize : function(){
				$('#sizedata').text('width:' + $(this).width() + ' / height:' + $(this).height());
			}
		});
	});
//]]>
</script>
<style type="text/css">
#container{
	margin:20px;
}
#resizeobject{
	background:#5b7e91;
	text-align:center;
	width:200px;
	height:200px;
}
#resizeobject p {
	padding:20px 0;
	color:#fff;
}
</style>
</head>
<body>
<div id="container">
	<div id="sizedata"></div>
	<div id="resizeobject">
		<p>右下でリサイズ</p>
	</div>
</div>
</body>
</html>