Getting Started With Alloy UI
The first step in using YUI is to load the YUI "seed".YUI is extremely modular, and the small seed file makes it easy to load only the modules you want to use on a given page.
The first step in using YUI is to load the YUI "seed".YUI is extremely modular, and the small seed file makes it easy to load only the modules you want to use on a given page.
<script src="http://yui.yahooapis.com/3.5.0/build/yui/yui-min.js"></script>
The seed file adds a single global variable to the page: the YUI object. To begin using YUI, you'll first create a new YUI instance and then tell that instance which YUI modules you want to use.
<div id="demo">Click me</div>
<script>
YUI().use('node', function (Y) {
// YUI will call this function and pass in the YUI instance (Y) once all
// modules have finished loading and are ready to use.
// We can now use Y.Node to get references to DOM elements using CSS selectors.
var demo = Y.one('#demo');
// And we can listen for DOM events.
demo.on('click', function (e) {
demo.set('text', 'You clicked me!');
});
});
</script>
Calling YUI() creates a brand new YUI instance without any active modules.
The use() method allows you to specify the modules that you want to load into your YUI instance.
We then call .use() on that new instance and pass in a list of modules we want to use, in the form of string parameters.
You can name as many modules as you like here.
Finally, we pass a callback function "such as function(Y)" that will be executed, once all those modules have finished loading.
he callback function receives the YUI instance as an argument, which we've named Y.
No comments:
Post a Comment