<html>
<head>
<style type="text/css">
</style>
<script language="JavaScript" type="text/javascript">
// Dojo configuration
djConfig = {
isDebug: true
};
</script>
<script language="JavaScript" type="text/javascript"
src="../../dojo.js"></script>
<script language="JavaScript" type="text/javascript">
dojo.require("dojo.lfx.*");
function wipeOut(elId){
dojo.lfx.wipeOut(elId, 300).play();
}
function wipeIn(elId) {
dojo.lfx.wipeIn(elId, 300).play();
}
</script>
</head>
<body>
<p>Note that the code currently does not support wiping table rows or table cells directly.</p>
<p>If you want to wipe a row you will need to do so by wiping a contained element such as a div.</p>
<table border="1" width=800>
<tr>
<td>I'm a row</td>
<td>I have 3 cells</td>
<td>yes i do</td>
</tr>
<tr id="testrow">
<td colspan="3">
<div>
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
</div>
</td>
</tr>
</table>
<br/>
<button type="button" onclick="wipeOut('testrow')">Wipe Out Row</button><br/>
<button type="button" onclick="wipeIn('testrow')">Wipe In Row</button><br/>
<br/>
<br/>
<table border="1" width=800>
<tr>
<td>I'm a row</td>
<td>I have 3 cells</td>
<td>yes i do</td>
</tr>
<tr>
<td colspan="3">
<div id="testrowcontent">
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
<div>Lots of content crammed into a cell.</div>
</div>
</td>
</tr>
</table>
<br/>
<button type="button" onclick="wipeOut('testrowcontent')">Wipe Out "Row"</button><br/>
<button type="button" onclick="wipeIn('testrowcontent')">Wipe In "Row"</button><br/>
<br/>
<br/>
<div id="testdiv" style="border:1px solid blue; width:600px">
<div>A test div.A test div.A test div.A test div.A test div.A test div.A test div.</div>
<div>A test div.A test div.A test div.A test div.A test div.A test div.A test div.</div>
<div>A test div.A test div.A test div.A test div.A test div.A test div.A test div.</div>
<div>A test div.A test div.A test div.A test div.A test div.A test div.A test div.</div>
<div>A test div.A test div.A test div.A test div.A test div.A test div.A test div.</div>
</div>
<br/>
<button type="button" onclick="wipeOut('testdiv')">Wipe Out Div</button><br/>
<button type="button" onclick="wipeIn('testdiv')">Wipe In Div</button><br/>
</body>
</html>