diff options
Diffstat (limited to 'includes/js/dojo/tests/test_fx.html')
-rw-r--r-- | includes/js/dojo/tests/test_fx.html | 107 |
1 files changed, 107 insertions, 0 deletions
diff --git a/includes/js/dojo/tests/test_fx.html b/includes/js/dojo/tests/test_fx.html new file mode 100644 index 0000000..8d9b0de --- /dev/null +++ b/includes/js/dojo/tests/test_fx.html @@ -0,0 +1,107 @@ +<!DOCTYPE html> +<html> + <head> + <style type="text/css"> + @import "../resources/dojo.css"; + </style> + <style type="text/css"> + @import "../resources/dojo.css"; + + body { + text-shadow: 0px 0px; + margin: 1em; + background-color: #DEDEDE; + } + + .box { + color: #292929; + /* color: #424242; */ + /* text-align: left; */ + width: 300px; + border: 1px solid #BABABA; + background-color: white; + padding-left: 10px; + padding-right: 10px; + margin-left: 10px; + margin-bottom: 1em; + -o-border-radius: 10px; + -moz-border-radius: 12px; + -webkit-border-radius: 10px; + -webkit-box-shadow: 0px 3px 7px #adadad; + /* -opera-border-radius: 10px; */ + border-radius: 10px; + -moz-box-sizing: border-box; + -opera-sizing: border-box; + -webkit-box-sizing: border-box; + -khtml-box-sizing: border-box; + box-sizing: border-box; + overflow: hidden; + /* position: absolute; */ + } + </style> + <script type="text/javascript" src="../dojo.js" djConfig="isDebug: true"></script> + <script type="text/javascript" src="../fx.js"></script> + <script type="text/javascript"> + dojo.require("dojo.fx"); + dojo.addOnLoad(function(){ + dojo.byId("foo").style.height = "0px"; + var w1 = dojo.fx.wipeIn({ + node: "foo", + duration: 500 + }); + var f1 = dojo.fadeOut({ + node: "foo", + duration: 500 + }); + var a1 = dojo.fx.chain([w1, f1]); + + dojo.byId("foo").style.height = "0px"; + var w2 = dojo.fx.wipeIn({ + node: "foo", + duration: 500 + }); + var f2 = dojo.fadeIn({ + node: "foo", + duration: 1000 + }); + var a2 = dojo.fx.combine([w2, f2]); + + dojo.connect(a1, "onEnd", function(){ + console.log("finish1"); + a2.play(); + }); + dojo.connect(a2, "onEnd", function(){ + console.log("finish2"); + }); + a1.play(); + }); + </script> + </head> + <body> + <div id="foo" class="box"> + <p> + Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean + semper sagittis velit. Cras in mi. Duis porta mauris ut ligula. + Proin porta rutrum lacus. Etiam consequat scelerisque quam. Nulla + facilisi. Maecenas luctus venenatis nulla. In sit amet dui non mi + semper iaculis. Sed molestie tortor at ipsum. Morbi dictum rutrum + magna. Sed vitae risus. + </p> + <p> + Aliquam vitae enim. Duis scelerisque metus auctor est venenatis + imperdiet. Fusce dignissim porta augue. Nulla vestibulum. Integer + lorem nunc, ullamcorper a, commodo ac, malesuada sed, dolor. Aenean + id mi in massa bibendum suscipit. Integer eros. Nullam suscipit + mauris. In pellentesque. Mauris ipsum est, pharetra semper, + pharetra in, viverra quis, tellus. Etiam purus. Quisque egestas, + tortor ac cursus lacinia, felis leo adipiscing nisi, et rhoncus + elit dolor eget eros. Fusce ut quam. Suspendisse eleifend leo vitae + ligula. Nulla facilisi. Nulla rutrum, erat vitae lacinia dictum, + pede purus imperdiet lacus, ut semper velit ante id metus. Praesent + massa dolor, porttitor sed, pulvinar in, consequat ut, leo. Nullam + nec est. Aenean id risus blandit tortor pharetra congue. + Suspendisse pulvinar. + </p> + </div> + </body> +</html>
\ No newline at end of file |