API Docs for: 0.0.2
Show:

effect.Effect Class

Module: Canvas

Base class for animations

Item Index

Methods

Methods

fly

(
  • config
)

Fly/Slide DOM node to a position

Parameters:

Example:

<div id="myDiv" style="position:absolute;width:100px;height:100px;border:1px solid #000;background-color:#DEF;left:50px;top:50px"></div>
    <script type="text/javascript">
     new ludo.effect.Effect().fly({
        el: 'myDiv',
        duration:.5,
        to:{ x:500, y: 300 },
         onComplete:function(){
             new ludo.effect.Effect().fly({
                el: 'myDiv',
                duration:1,
                to:{ x:600, y: 50 }
             });
         }
     });
</script>

Which will first move "myDiv" to position 500x300 on the screen, then to 600x50.

flyTo

(
  • el
  • x
  • y
  • seconds
)

Fly/Slide DOM node from current location to given x and y coordinats in given seconds.

Parameters:

Example:

You may also use this method like this:

<div id="myDiv" style="position:absolute;width:100px;height:100px;border:1px solid #000;background-color:#DEF;left:50px;top:50px"></div>
    <script type="text/javascript">
new ludo.effect.Effect().flyTo('myDiv', 500, 300, .5);
</script>

Which slides "myDiv" to position 500x300 in 0.5 seconds.

Events

animationComplete

Fired when animation is completed

Event Payload: