Updated

2013-02-20 10:38:25 +01:00
parent 17c3936ab6
commit 5d14b9e2d4
1919 changed files with 559755 additions and 2588 deletions
--- a/master/examples/test_easing.html
+++ b/master/examples/test_easing.html
@@ -0,0 +1,130 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
+        "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+<head>
+	<title>dojox.fx.easing functions:</title>
+		
+	<script type="text/javascript" src="../../../dojo/dojo.js" djConfig="isDebug:true, parseOnLoad: true" ></script>
+	<style type="text/css">
+		@import "../../../dojo/resources/dojo.css";
+		@import "../../../dijit/themes/dijit.css";
+		@import "../../../dijit/themes/tundra/tundra.css";
+		@import "../../../dijit/tests/css/dijitTests.css";
+
+		.bounce {
+			position:absolute;
+			top:300px;
+			left:400px;
+			width:25px;
+			height:25px;
+			border:1px solid #b7b7b7;
+			background:#ededed;
+		}
+
+		.block {
+			width:200px;
+			height:100px;
+			background:#666;
+			border:1px solid #ccc;
+			display:block; 
+			color:#fff;
+			text-align:center; 
+		}
+	
+	</style>
+	<script type="text/javascript">
+		dojo.require("dojo.fx"); // chain and combine should be in core :) (when they work)
+		dojo.require("dojo.fx.easing"); 
+
+
+		var allAnim = null; 
+		dojo.addOnLoad(function(){
+
+		var easeInAnim = dojo.fx.chain([
+			dojo.fadeOut({
+				node: 'easeIn',
+				duration:2000,
+				easing: dojo.fx.easing.easeIn
+			}),
+			dojo.fadeIn({	
+				node: 'easeIn',
+				duration:2000,
+				easing: dojo.fx.easing.easeIn
+			})
+		]);
+
+
+		var easeOutAnim = dojo.fx.chain([
+			dojo.fadeOut({
+				node: 'easeOut',
+				duration:2000,
+				easing: dojo.fx.easing.easeOut
+			}),
+			dojo.fadeIn({	
+				node: 'easeOut',
+				duration:2000,
+				easing: dojo.fx.easing.easeOut
+			})
+		]);
+
+		var easeInOutAnim = dojo.fx.chain([
+			dojo.fadeOut({
+				node: 'easeInOut',
+				duration:2000
+			}),
+			dojo.fadeIn({	
+				node: 'easeInOut',
+				duration:2000
+			})
+		]);
+
+		var linearEaseAnim = dojo.fx.chain([
+			dojo.fadeOut({
+				node: 'linearEase',
+				duration:2000,
+				easing: dojo.fx.easing.linear
+			}),
+			dojo.fadeIn({
+				node: 'linearEase',
+				duration:2000,
+				easing: dojo.fx.easing.linear
+			})
+		]);
+
+		dojo.connect(dojo.byId('easeIn'),"onclick",easeInAnim,"play");
+		dojo.connect(dojo.byId('easeOut'),"onclick",easeOutAnim,"play");
+		dojo.connect(dojo.byId('easeInOut'),"onclick",easeInOutAnim,"play");
+		dojo.connect(dojo.byId('linearEase'),"onclick",linearEaseAnim,"play");
+
+		allAnim = { play: function(){ 
+			easeInAnim.play();
+			easeOutAnim.play();
+			easeInOutAnim.play(); 
+			linearEaseAnim.play();
+			} 
+		}; 
+
+		}); // dojo.addOnLoad
+	</script>
+</head>
+<body class="tundra">
+
+	<h1 class="testTitle">dojox.fx.easing function tests:</h1>
+
+	(click block to play animation, or <a href="#" onclick="allAnim.play()">here to do all three</a>)
+
+	<div id="easeIn" class="block">dojo.fx.easing.easeIn</div>
+	<br><br>
+	<div id="easeOut" class="block">dojo.fx.easing.easeOut</div>
+	<br><br>
+	<div id="linearEase" class="block">dojo.fx.easing.linear</div>
+	<br><br>
+	<div id="easeInOut" class="block">dojo default easing</div>
+	
+	<p>
+	dojo.fx.easing is stand-alone, and does not require the dojox.fx base files. to see a chart
+	of these functions see <a href="example_easingChart2D.html">example_easingChart2D.html</a> 
+	</p>	
+
+</body>
+</html>