Fork me on GitHub

How to use it?

A few things you should do to start creating awesome websites with beautiful components ;)


1. Copy and paste

<script src="https://cdn.alloyui.com/3.0.1/aui/aui-min.js"></script>

This is an ultra-small bit of JavaScript that enables you to load any AlloyUI modules on your page.

<link href="https://cdn.alloyui.com/3.0.1/aui-css/css/bootstrap.min.css" rel="stylesheet"></link>

And this is the base style for all components, it's a fork from the popular Bootstrap project with some minor additions.


2. Getting started!

Let's create an YUI instance and do some simple stuff, like capturing a DOM element and attaching a click event to it. Then let's run some transitions!

YUI().use( 'node', 'transition', function (Y) { Y.one('.btn').on( 'click', function() { this.transition( { width: '500px' } ); } ); } );

3. Using a UI component

Now let's take advantage of all the power that AlloyUI has and use Carousel, one the UI components.

YUI().use( 'aui-carousel', function(Y) { new Y.Carousel( { contentBox: '#myCarousel', } ).render(); } );