横幅、縦幅を変える

書式

animeObj = new YAHOO.util.Anim(element, {
width: { paramW },
height: { paramH }})

animeObj : アニメーションオブジェクト
element : ページ上のエレメント
paramW : 横幅 (from, to, byで指定)
paramH : 縦幅 (from, to, byで指定)

説明

　横幅、縦幅を変えるにはYAHOO.util.Anim()の2番目のパラメータにwidth, heightを指定します。どちらか一方だけ指定することもできます。width, heightの設定値はfrom, to, byを指定でき、fromが開始幅、toが終了幅（絶対値）、byが終了幅（相対値）となります。指定する場合には最低限toまたはbyで終了幅を指定する必要があります。また、unitを使って単位を指定することもできます。unitで指定できる単位はスタイルシートで指定できるものと同じです。
Ajaxライブラリ リファレンス

サンプルコード [実行]

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Sample</title>
<link rel="stylesheet" href="main.css" type="text/css" media="all">
<script type="text/javascript" src="yui/yahoo.js"></script>
<script type="text/javascript" src="yui/event.js"></script>
<script type="text/javascript" src="yui/dom.js"></script>
<script type="text/javascript" src="yui/animation.js"></script>
<script type="text/javascript"><!--
function startAnime(){
var boxObj = new YAHOO.util.Anim("box", {
width: { from:100, to:320 },
height: { from:100, by:140, unit:"px" } });
boxObj.animate();
}
// --></script>
</head>
<body>
<h1>アニメーション処理</h1>
<form>
<input type="button" value="開始" onClick="startAnime()">
</form>
<div id="box">
ここの横幅と縦幅が変わります。
</div>
</body>
</html>