HTML5里面的一个知识：Canvas二层与KineticJS完成事件！

来源：互联网发布：adobe全套软件下载编辑：程序博客网时间：2024/05/29 13:40

触发一个用户定义函数当二层与KineticJS结束,我们可以设置onFinish进行。

代码的确写得挺好的，下面呢，我也不说其它的啦，直接上代码给大家看：

<!DOCTYPE HTML><html>  <head>    <style>      body {        margin: 0px;        padding: 0px;      }    </style>  </head>  <body>     <div id="container"></div>    <script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.7.1.min.js"></script>    <script defer="defer">      function writeMessage(message) {        text.setText(message);        layer.draw();      }            var stage = new Kinetic.Stage({        container: 'container',        width: 578,        height: 200      });            var layer = new Kinetic.Layer();      var text = new Kinetic.Text({        x: 10,        y: 10,        fontFamily: 'Calibri',        fontSize: 24,        text: '',        fill: 'black'      });            var wheel = new Kinetic.Star({        x: stage.getWidth() / 2,        y: stage.getHeight() / 2,        numPoints: 50,        outerRadius: 70,        innerRadius: 50,        fill: 'purple',        stroke: 'black',        strokeWidth: 5,        lineJoin: 'bevel'      });      layer.add(wheel);      layer.add(text);      stage.add(layer);      var tween = new Kinetic.Tween({        node: wheel,         duration: 4,        rotation: Math.PI * 2,        easing: Kinetic.Easings.BackEaseOut,        onFinish: function() {          writeMessage('tween finished!');        }      });            setTimeout(function() {        tween.play();      }, 1000);    </script>  </body></html>