r3425 committed - fadequeue test: added slide up/down example, same problem as for fadeI...
Revision: 3425
Author: joern.zaefferer
Date: Mon Nov 9 05:21:27 2009
Log: fadequeue test: added slide up/down example, same problem as for
fadeIn/Out
http://code.google.com/p/jquery-ui/source/detail?r=3425
Modified:
/branches/labs/fadequeue/index.html
=======================================
--- /branches/labs/fadequeue/index.html Sun Nov 8 02:07:29 2009
+++ /branches/labs/fadequeue/index.html Mon Nov 9 05:21:27 2009
@@ -41,6 +41,28 @@
else
target.stop().fadeOut(time());
});
+
+ function time2() {
+ return parseInt($("#time2").val());
+ }
+ $("#down").click(function() {
+ $("#target2").slideDown(time2());
+ });
+ $("#down2").click(function() {
+ $("#target2").stop().slideDown(time2());
+ });
+ $("#down3").click(function() {
+ $("#target2").stop(false, true).slideDown(time2());
+ });
+ $("#up").click(function() {
+ $("#target2").slideUp(time2());
+ });
+ $("#up2").click(function() {
+ $("#target2").stop().slideUp(time2());
+ });
+ $("#up3").click(function() {
+ $("#target2").stop(false, true).slideUp(time2());
+ });
});
</script>
</head>
@@ -69,5 +91,17 @@
<li>fadeIn/Out can use opacity values defined in CSS stylesheets,
while fadeTo requires the user to specify the opacity</li>
</ul>
</div>
+
+ <button id="down">Slide up</button>
+ <button id="down2">Stop, Slide up</button>
+ <button id="down3">Stop, goto end, Slide up</button>
+ <br/>
+ <button id="up">Slide down</button>
+ <button id="up2">Stop, Slide down</button>
+ <button id="up3">Stop, goto end, Slide down</button>
+ <br/>
+ Slide duration: <input id="time2" value="2000" />
+
+ <div id="target2" style="margin: 3em; background: black; color:
white; width: 100px; height: 100px">slide this</div>
</body>
</html>