-<html>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr">
<head>
-<title>Animation Test Suite</title>
-<script src="../dist/jquery.js"></script>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>Animation Test Suite</title>
+ <script src="../dist/jquery.js"></script>
<style>
div#tests h4 {
background: red;
div#tests div.noback {
background-image: none;
}
+
+div.chain, div.chain div { width: 100px; height: 20px; position: relative; float: left; }
+div.chain div { position: absolute; top: 0px; left: 0px; }
+
+div.chain.test { background: red; }
+div.chain.test div { background: green; }
+
+div.chain.out { background: green; }
+div.chain.out div { background: red; display: none; }
</style>
<script>
var visible = {
var cur_o = jQuery.attr(this.style, "opacity");
if ( cur_o !== "" ) cur_o = parseFloat( cur_o );
- if ( (t_o == "hide"||t_o == "show") && cur_o != f_o )
+ if ( (t_o == "hide"||t_o == "show") && cur_o != f_o ) {
return msg(this, "Opacity not reset to " + f_o + ": " + cur_o);
+ }
if ( t_w == "hide" && this.style.display != "none" )
return msg(this, "Hiding, display not none: " + this.style.display);
});
});
});
+
+ // Chaining Tests
+ $('#fadein div').fadeOut('fast').fadeIn('fast');
+ $('#fadeout div').fadeIn('fast').fadeOut('fast');
+
+ $('#show div').hide('fast').show('fast');
+ $('#hide div').show('fast').hide('fast');
+
+ $('#togglein div').toggle('fast').toggle('fast');
+ $('#toggleout div').toggle('fast').toggle('fast');
+
+ $('#slidedown div').slideDown('fast').slideUp('fast');
+ $('#slideup div').slideUp('fast').slideDown('fast');
+
+ $('#slidetogglein div').slideToggle('fast').slideToggle('fast');
+ $('#slidetoggleout div').slideToggle('fast').slideToggle('fast');
});
function pass( elem ) {
</script>
</head>
<body>
+<b>Chain Tests:</b><br/>
+<div id="fadein" class='chain test'>fadeIn<div>fadeIn</div></div>
+<div id="fadeout" class='chain test out'>fadeOut<div>fadeOut</div></div>
+
+<div id="show" class='chain test'>show<div>show</div></div>
+<div id="hide" class='chain test out'>hide<div>hide</div></div>
+
+<div id="togglein" class='chain test'>togglein<div>togglein</div></div>
+<div id="toggleout" class='chain test out'>toggleout<div>toggleout</div></div>
+<br style="clear:both;"/>
+
+<div id="slideup" class='chain test'>slideUp<div>slideUp</div></div>
+<div id="slidedown" class='chain test out'>slideDown<div>slideDown</div></div>
+
+<div id="slidetogglein" class='chain test'>slideToggleIn<div>slideToggleIn</div></div>
+<div id="slidetoggleout" class='chain test out'>slideToggleOut<div>slideToggleOut</div></div>
+<br style="clear:both;"/>
+
<div id="tests"></div>
</body>
</html>