Tween with kinetic.js

<html>
<body>
<div id=”ok”></div>
<script src=”http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v5.0.1.min.js”></script&gt;
<script defer=”defer”>
var stage=new Kinetic.Stage({
container:’ok’,
width:500,
height:500
});
var layer=new Kinetic.Layer();
var text=new Kinetic.Text({
x:100,
y:200,
fontFamily:’Calibri’,
fontSize:24,
text:”,
fill:’black’
});
var wheel=new Kinetic.Star({
x:stage.width()/2,
y:stage.height()/2,
numPoints:50,
innerRadius:50,
outerRadius:70,
fill:’purple’,
stroke:’black’,
strokeWidth:5,
lineJoin:’bevel’
});
layer.add(wheel);
stage.add(layer);
var tween=new Kinetic.Tween({
node:wheel,
duration:4,
rotation:720,
easing:Kinetic.Easings.BackEaseOut
});
setTimein(function(){
tween.play();
},1000);
</script>
</body>
</html>

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s