Introduction to haXe/JS

Some explanations

Import classes needed.

import js.Dom; //Used to access Dom elements
import js.Lib; // used to acces window and document element
import feffects.Tween; // used for our interpolation
import feffects.easing.Linear; //type of the interpolation we want to use

I get the element I want to animate :

var monElement = Lib.document.getElementById('my_element_ID');

static function makeAppear()
{     
     /* new Tween(start value, end value, duration, tween type)*/
    
   var myInterpolation = new Tween(0, 1, 900, Linear.easeIn);
    
   /* Set tween handlers*/
   myInterpolation.setTweenHandlers(appear, over);

   /* start it*/
   
   myInterpolation.start();
} 

static function appear(e:Float)
    {
        var myElement = Lib.document.getElementById('my_element_ID');
        
        /*Modify all the differents properties that effect on the opacity*/
        monElement.style.filter = "alpha(opacity="+(e*100)+")";
        monElement.style.MozOpacity = e;
        monElement.style.KhtmlOpacity = e;
        monElement.style.opacity = e;
    }

MyWebPage.html

Let's write our web page, and don't forget to add the JS script :

<html>
    <head>
        <script type="text/javascript" src="main.js"></script>> 
    </head>
    <body onload="Main.makeAppear();">
        <div id="my_element_ID">
            HELLO HAXERS !
        </div>
    </body>
</html>
sources.zip
(35 times)