I love real live examples, do you have one ? :)
On 3/3/06, Robin Haswell <[EMAIL PROTECTED]> wrote:
> Oops, should provide an example:
>
> <div id="accordion">
> <div>
> <h3>Heading></h3>
> <div>
> <p>Content geoes here</p>
> <p>Etc..</p>
> </div>
> </div>
> <div>
> <h3>Another heading</h3>
> <div>
> <p>Yet more tatsy content</p>
> <p>Rinse, repeat</p>
> </div>
> </div>
> </div>
> <script>
> new Effect.Accordion("accordion");
> </script>
>
> -Rob
>
> Robin Haswell wrote:
> > Hello boys and girls
> >
> > In the ever-loving spirit of OSS, here's another feature for s.a.u.
> >
> > In particular it's called Effect.Accordion, and is a scriptaculified
> > version of openrico's Accordion.
> >
> > Work in progress, I'll submit further modifications as the come in, but
> > this is 90% of what needs to be done. I anticipate some bugs when I
> > start using it more.
> >
> > Tested on FF1.5 and IE6/7.
> >
> > Comments are welcome, and in fact solicited. I'd appreciate all bugfixes
> > sent either to this list or myself.
> >
> > Yours,
> >
> > -Rob
> >
> > PS. This isn't a patch, it's just JS. However this server won't allow
> > attachments with a .js extension, which is, well, ridiculous.
> >
> >
> > ------------------------------------------------------------------------
> >
> > Effect.Accordion = Class.create();
> > Effect.Accordion.prototype = {
> > initialize: function(element, options) {
> > this.container = $(element);
> > this.options = Object.extend({
> > paneltag: "div", // The tag of the panel containers
> > headingtag: "h3", // The tag of the headings
> > bodytag: "div", // The body
> > initdisplay: 0 // Index of the panel to show first
> > }, options || {});
> > this.options.paneltag = this.options.paneltag.toUpperCase();
> > this.options.headingtag =
> > this.options.headingtag.toUpperCase();
> > this.options.bodytag = this.options.bodytag.toUpperCase();
> > // We should probably sort out some event listeners
> > this.panels = Array();
> > panels = this.container.childNodes;
> > pl = panels.length;
> > n = 0;
> > for (i = 0; i < pl; i++) {
> > if (panels[i].nodeName != this.options.paneltag)
> > continue;
> > this.panels[n] = panels[i];
> > n++;
> > }
> > pl = this.panels.length;
> > this.clickHandler =
> > this.onClickHeading.bindAsEventListener(this);
> > for (i = 0; i < pl; i++) {
> > heading = this.getPanelHeading(this.panels[i]);
> > if (this.options.initdisplay != i) {
> > body = this.getPanelBody(this.panels[i]);
> > Element.hide(body);
> > } else {
> > this.curvisible = i;
> > }
> > Event.observe(heading, "click", this.clickHandler);
> > }
> > },
> > onClickHeading: function(ev) {
> > el = Event.element(ev);
> > panel = el.parentNode;
> > if (panel == this.panels[this.curvisible])
> > return;
> > newborn = this.getPanelBody(panel);
> > victim = this.getPanelBody(this.panels[this.curvisible]);
> > this.curvisible = this.getPanelNumber(panel);
> > new Effect.Parallel (
> > [
> > Effect.BlindUp(victim),
> > Effect.BlindDown(newborn)
> > ], {
> > duration: 0.1
> > });
> > },
> > getPanelHeading: function(el) {
> > return el.getElementsByTagName(this.options.headingtag)[0];
> > },
> > getPanelBody: function(el) {
> > n = 0;
> > if (this.options.bodytag == this.options.headingtag)
> > n = 1;
> > return el.getElementsByTagName(this.options.bodytag)[n];
> > },
> > /*
> > getPanelBody: function(el) { // FIXME: Longer version to compensate
> > for the body tag appearing in the heading tag. This sliently halts
> > execution however. Fix if you need it.
> > n = 0;
> > if (this.options.bodytag == this.options.headingtag)
> > n = 1;
> > children = el.childNodes;
> > cl = children.length;
> > for (i = 0; i < cl; i++) {
> > if (children[i].nodeName == this.options.bodytag) {
> > if (n == 0)
> > return children[i];
> > else
> > n = n-1;
> > }
> > }
> > }
> > */
> > getPanelNumber: function(el) {
> > pl = this.panels.length;
> > for (i = 0; i < pl; i++) {
> > if (this.panels[i] == el)
> > return i;
> > }
> > return "Not found";
> > }
> > };
> >
> >
> > ------------------------------------------------------------------------
> >
> > _______________________________________________
> > Rails-spinoffs mailing list
> > [email protected]
> > http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs
> _______________________________________________
> Rails-spinoffs mailing list
> [email protected]
> http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs
>
_______________________________________________
Rails-spinoffs mailing list
[email protected]
http://lists.rubyonrails.org/mailman/listinfo/rails-spinoffs
