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();
}
);