書式
new Effect.Morph(element, { style:cssProp} , option)element.morph(cssProp, option)
element : ページ上のエレメント
cssProp : スタイルシートのプロパティと値のセット
option : 以下のオプションをハッシュ形式で指定可能【省略可能】
duration : エフェクト開始から終了までの時間
説明
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="prototype.js"></script>
<script type="text/javascript" src="effects.js"></script>
<script type="text/javascript"><!--
function morphStart(){
new Effect.Morph('box',{
style:'background:#f00; color:#fff;border: 20px solid #f88; font-size:24pt; opacity:0.5',
duration:0.8
});
}
// --></script>
</head>
<body>
<h1>morphサンプル</h1>
<form>
<input type="button" value="実行" onClick="morphStart()" />
</form>
<div id="box">morphサンプル</div>
</body>
</html>