Fade Color Demo : Fade « Ajax Layer « JavaScript DHTML






Fade Color Demo


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

  var inc=0;
  var lastColor='#FFCC00';
  var newColor='#000000';

  var lyr = new DynLayer(null,100,100,200,200,lastColor);
  dynapi.document.addChild(lyr)

  dynapi.document.addChild(new DynLayer(null,10,50,20,20),'lyrFrom')
  dynapi.document.addChild(new DynLayer(null,35,50,20,20),'lyrTo')

  function fadeLyr(){
    inc+=5;
    var c=dynapi.functions.fadeColor(lastColor,newColor,inc)
    if(inc<100) window.setTimeout('fadeLyr()',50);
    else inc=0;
    lyr.setBgColor(c);
  };

  function start(){
    lastColor=lyr.getBgColor();
    newColor=dynapi.functions.getRandomColor();
    dynapi.document.lyrFrom.setBgColor(lastColor);
    dynapi.document.lyrTo.setBgColor(newColor);
    fadeLyr();
  }

</script>
</head>
<body>
<a href="javascript:start()">Fade Layer Color</a>
</body>
</html>
           
       








dynapi.zip( 791 k)

Related examples in the same category

1.Animation Example - Fade
2.Animation: fade in and fade out