Thanks for the Reply Sir Walter,
Im looking checking for the moo.fx accordion for prototype accordion.
However, the documentation is not so good.
I can't see any good tutorial in google too..
anyway thanks,
________________________________
From: Walter Lee Davis <wa...@wdstudio.com>
To: prototype-scriptaculous@googlegroups.com
Sent: Monday, March 29, 2010 8:07:10 AM
Subject: Re: [Proto-Scripty] -[Accordion]-...
Have a look over at Scripteka.com -- the canonical repository for all things
Prototype extension-shaped. There are loads of different ways to skin this cat,
including writing your own long-hand. I think it takes maybe 12 lines of script
if you space it out and make it all purty.
For this structure:
<div id="outer">
<h3>First segment</h3>
<div class="inner">
<p>First segment's content here.</p>
</div>
...
<h3>Last segment</h3>
<div class="inner">
<p>Last segment's content here.</p>
</div>
</div>
You could do this:
//include just prototype.js in your page head
//roll up all but the first one
var bodies = $$('.inner');
bodies.invoke('hide').first().show();
$('outer').select('h3').invoke('observe','click',function(evt){
//if you want only one to be open at a time:
bodies.invoke('hide');
this.next('div').show();
});
If you link the Scriptaculous Effects library into your page after Prototype,
then you can animate the transition thus:
$('outer').select('h3').invoke('observe','click',function(evt){
//if you want only one to be open at a time:
bodies.findAll(function(elm){return elm.visible();}).invoke('slideUp');
this.next('div').slideDown();
});
That's all untested but it should get you nearly there.
Walter
On Mar 28, 2010, at 7:33 PM, Hariz Soleminio wrote:
> Hi Guys,
>
> hmmm.... i've wondering if there is such an easy way to use accordion in
> prototype guys?
> is there such plugins addons for prototype?
> Or should i used the scriptacolous 2 and use Effect.SlideUp effect?
>
> Thanks Prototype Fans...
>
>
>
> Connect instantly with more friends on your blog and personal website?
> Create your latest Pingbox today! http://ph.messenger.yahoo.com/pingbox
>
> --You received this message because you are subscribed to the Google Groups
> "Prototype & script.aculo.us" group.
> To post to this group, send email to prototype-scriptacul...@googlegroups.com.
> To unsubscribe from this group, send email to
> prototype-scriptaculous+unsubscr...@googlegroups.com.
> For more options, visit this group at
> http://groups.google.com/group/prototype-scriptaculous?hl=en.
>
--You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
"Try the new FASTER Yahoo! Mail. Experience it today at
http://ph.mail.yahoo.com"
--
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
