dojo.NodeList-fx

Status:Draft Since:1.2

Contents

• dojo.NodeList-fx

This module incorporates dojo.fx functionality into dojo.query by extending the dojo.NodeList Class.

The first most important thing to do is require the module into your page:

dojo.require("dojo.NodeList-fx");

To use your newly created functions in NodeList, issue a dojo.query() call:

<button id="fadebutton">Fade Them Out</button>
<div id="fadebuttontarget">
   <li class="thinger">Item One</li>
   <li class="thinger">Item Two</li>
</div>

<button id="fadebutton">Fade Them Out</button> <div id="fadebuttontarget"> <li class="thinger">Item One</li> <li class="thinger">Item Two</li> </div>

<script type="text/javascript">
   dojo.require("dojo.NodeList-fx");
   dojo.addOnLoad(function(){
       dojo.query("#fadebutton").onclick(function(){
           dojo.query("#fadebuttontarget li").fadeOut().play();
       });
   });
</script>

<script type="text/javascript"> dojo.require("dojo.NodeList-fx"); dojo.addOnLoad(function(){ dojo.query("#fadebutton").onclick(function(){ dojo.query("#fadebuttontarget li").fadeOut().play(); }); }); </script>

The most important thing to note is NodeList <dojo/NodeList> animations return an instance of a dojo.Animation, the foundation for all Dojo FX. This prevents further chaining, as you have to explicitly call .play() on the returned animation. New Dojo 1.4 introduced a way to allow continued chaining with the caveat you cannot obtain a reference to the animations after they have begun. Simply pass the auto parameter.

dojo.require("dojo.NodeList-fx");
dojo.ready(function(){
     dojo.query("li.evens")
         .fadeOut({
            duration:1000,
            onEnd: function(){ ... },
            // begin playing immediately, and return the nodeList for further iteration
            auto:true
         })
         .onclick(doSomething)
     ;
});

The parameters you can specify to each animation provided are identical to their dojo.fx counterparts, omitting the node: parameter, as each node in the NodeList is passed for you.

There are more NodeList animations provided by the dojox.fx.ext-dojo.NodeList module, in the dojox.fx project.

Table of Contents

• dojo.NodeList-fx