Hello everyone! I''m new to script.aculo.us. I took someone code on wiki.script.aculo.us and update alittle bit. However, there is still a problem occur when the user clicks repeatedly 2 or 3 times over each header. Another problem is that when it first render effects, it is alittle stuck for the first time. Can anyone help me to solve this code for me? <div id="accordion"> <div id="panel1"> <h3 id="visible" onClick="accordion(this)">Panel 1</h3> <div id="panel1-body" class="panel_body"> <div> This is the contents of this panel. </div> </div> </div> <div id="panel2"> <h3 onClick="accordion(this)">Panel 2</h3> <div id="panel2-body" class="panel_body"> <div> This is the contents of this panel. </div> </div> </div> <div id="panel3"> <h3 onClick="accordion(this)">Panel 3</h3> <div id="panel3-body" class="panel_body"> <div> This is the contents of this panel. </div> </div> </div> <div id="panel4"> <h3 onClick="accordion(this)">Panel 4</h3> <div id="panel4-body" class="panel_body"> <div> This is the contents of this panel. </div> </div> </div> </div> <script type="text/javascript"> function accordion(el) { if ($(''visible'') == el) { var current = el.parentNode.id+''-body''; //new Effect.SlideUp(current, {queue: ''front'', duration: 0.7, limit: 2}); //new Effect.SlideDown(current, {queue: ''end'', duration: 0.7, limit: 2}); var queue = Effect.Queues.get(''panel''); queue.each(function(e) { e.cancel() }); new Effect.SlideUp(current, {queue: {position:''front'', scope: ''panel'', duration: 0.7, limit:2} }); new Effect.SlideDown(current, {queue: {position:''end'', scope: ''panel'', duration: 0.7, limit:2} }); window.status = Effect.Queues; return; } if ($(''visible'')) { var eldown = el.parentNode.id+''-body''; var elup = $(''visible'').parentNode.id+''-body''; //alert(eldown + " " + elup); /*new Effect.Parallel( [ new Effect.SlideUp(elup), new Effect.SlideDown(eldown) ], { duration: 0.5 });*/ //new Effect.SlideUp(elup, {queue: ''front'', duration: 0.7, limit: 2}); //new Effect.SlideDown(eldown, {queue: ''end'', duration: 0.7, limit: 2}); var queue = Effect.Queues.get(''panel''); queue.each(function(e) { e.cancel() }); new Effect.SlideUp(elup, {queue: {position:''front'', scope: ''panel'', duration: 0.7, limit:2} }); new Effect.SlideDown(eldown, {queue: {position:''end'', scope: ''panel'', duration: 0.7, limit:2} }); $(''visible'').id = ''''; } el.id = ''visible''; } function init() { // hide all elements apart from the one with id visible var acc = document.getElementById(''accordion''); var apanels = acc.getElementsByTagName(''div''); for (i = 0; i < apanels.length; i++) { if (apanels[i].className == ''panel_body'') { apanels[i].style.display = ''none''; } } var avis = document.getElementById(''visible'').parentNode.id+''- body''; document.getElementById(avis).style.display = ''block''; prev = avis; } function addEvent(elm, evType, fn, useCapture) { elm["on"+evType]=fn;return; } addEvent(window, "load", init); </script> Thanks Chamnap --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Ruby on Rails: Spinoffs" group. To post to this group, send email to rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org To unsubscribe from this group, send email to rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org For more options, visit this group at http://groups.google.com/group/rubyonrails-spinoffs?hl=en -~----------~----~----~----~------~----~------~--~---