スライド処理 (slideTo)

書式

dojo.lfx.html.slideTo(nodes, propList, duration, easing, callback)

nodes : DOMノード。配列で複数指定可能。
propList : top, leftなどアニメーションに関するプロパティリスト
duration : 処理にかかるミリ秒【省略可能】
easing : 表示方法／モーション指定【省略可能】
callback : コールバック関数【省略可能】

説明

スライド処理で指定された座標に移動させるにはslideTo()を使います。最初のパラメータはDOMノードを指定します。単独の場合は、そのままID名等を指定します。複数の領域を同時に処理したい場合にはDOMノードの配列を指定します。例えばdojo.lfx.html.slideTo(["slideArea1", "slideArea2"], {top:200, left:300 }, 1000).play();とするとID名がslideArea1とslideArea2の2つのブロックが同時に処理されます。

Ajaxライブラリ リファレンス

サンプルコード [実行]

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Dojo Sample</title>
<link rel="stylesheet" type="text/css" href="main.css" media="all">
<script type="text/javascript" src="dojo.js"></script>
<script type="text/javascript"><!--
function djSlide(){
dojo.lfx.html.slideTo("slideArea", {top:200, left:300 }, 1000).play();
}
// --></script>
</head>
<body>
<h1>スライド処理</h1>
<form>
<input type="button" value="エフェクト開始" onClick="djSlide()">
</form>
<div id="slideArea">Dojoエフェクトサンプル<br>
<img src="images/DSC0001.jpg">
</div>
</body>
</html>