Caridy Patino![]()
Featured Item
The Accordion Node Plugin makes it easy to transform existing markup into an accordion element with expandable and collapsible elements. Elements are easy to customize, and only require a small set of dependencies.
To use the Accordion Node Plugin, simply pass a reference to the plugin to a Node instance's plug method.
// Call the "use" method, passing in "gallery-node-accordion". This will
// load the script and CSS for the Accordion Node Plugin and all of
// the required dependencies.
YUI().use("gallery-node-accordion", function(Y) {
// Use the "contentready" event to initialize the accordion when
// the element that represente the accordion
// (<div id="accordion1">) is ready to be scripted.
Y.on("contentready", function () {
// Callback scope will be a Node instance for (<div id="accordion1">).
// Therefore, since "this" represents a Node instance, it
// is possible to just call "this.plug".
this.plug(Y.Plugin.NodeAccordion);
}, "#accordion1");
});
The Accordion Node Plugin has several configuration properties that can be set via an object literal that is passed as a second argument to a Node instance's plug method.
// Including animation module to support smooth transitions
YUI().use("gallery-node-accordion", "anim", function(Y) {
// Passing a second argument to customize some attributes
Y.one('#accordion2').plug(Y.Plugin.NodeAccordion, {
anim: true,
effect: Y.Easing.backIn
});
});
It also has several configuration properties that can be set via an object literal that is passed as a second argument to a Node instance's plug method. More attributes and other details here:
Run this test in your browser and report any issue.
Note: Make sure you include OS, Browser Version and the test result from YUI Console in your ticket.
Injecting node accordion plugin into a YUI 3 Node element.
<script src="http://yui.yahooapis.com/3.1.0/build/yui/yui-min.js"></script>YUI({
//Last Gallery Build of this module
gallery: 'gallery-2010.05.21-18-16'
}).use('gallery-node-accordion', function(Y) {
Y.one("#myaccordion").plug(Y.Plugin.NodeAccordion);
});| Subject | Author | Date |
|---|---|---|
| Node accordion - works in 3.0.0, not in 3.1.0 | henk b | 04/13/10 |
| Re: Node accordion - works in 3.0.0, not in 3.1.0 | Caridy Patino | 04/18/10 |
| Re: Node accordion - works in 3.0.0, not in 3.1.0 | henk b | 04/21/10 |
| Death by Firebug | John Bercik | 06/10/10 |
| Re: Death by Firebug | Caridy Patino | 06/10/10 |
© 2010 YUI Library - Site Credits