Path Animation Slide

Path Animation Slide : Animation Path : Ajax Layer JAVASCRIPT DHTML TUTORIALS

JAVASCRIPT DHTML TUTORIALS » Ajax Layer » Animation Path »




http://dynapi.sourceforge.net/
GNU LESSER GENERAL PUBLIC LICENSE
Version 2.1, February 1999
<html>
<head>
<title>DynAPI Examples - Path Animation [Slide]</title>
<script language="JavaScript" src="./dynapisrc/dynapi.js"></script>
<script language="Javascript">
dynapi.library.setPath('./dynapisrc/');
dynapi.library.include('dynapi.api');
dynapi.library.include('dynapi.library');
dynapi.library.include('dynapi.debug');
dynapi.library.include('SlideAnimation');
</script>
<script language="Javascript">

dynapi.onLoad(function() {
  block = new DynLayer();
  block.setSize(20,20);
  block.setLocation(100,100);
  block.setBgColor("red");


  var listener = {};
  listener.onthreadstart = function(e) {
    status = "start";
  }
  listener.onthreadrun = function(e) {
    var o = e.getSource();
    status = "play "+o.x+" "+o.y;
  }
  listener.onthreadstop = listener.onthreadfinish = function(e) {
    var o = e.getSource();
    status = "stop "+o.x+" "+o.y;;
  }
  block.addEventListener(listener);


  dynapi.document.addChild(block);
});

//-->
</script>
</head>

<body bgcolor="#999999">

<p>SlideTo:
<br>(<a href="javascript://" onclick="javascript:block.slideTo(100,100)">100,100</a>)
<br>(<a href="javascript://" onclick="javascript:block.slideTo(200,100)">200,100</a>)
<br>(<a href="javascript://" onclick="javascript:block.slideTo(200,200)">200,200</a>)
<br>(<a href="javascript://" onclick="javascript:block.slideTo(100,200)">100,200</a>)
<br>(<a href="javascript://" onclick="javascript:block.slideTo(400,50)">400,50</a>)
<br>(<a href="javascript://" onclick="javascript:block.slideTo(50,400)">50,400</a>)

</body>
</html>