Hello,

I am trying to build a module that will give the user a place to insert title and panel content for an accordion. I also want to allow the user to choose whether they want the titles to show up above the panel content (traditional accordion) or to show up on the side.

Here is what I have so far:

PHP Code:
<?php
//Collect Parameters
$layout=$params->get('layout');

$row1 = array($params->get('item1'),$params->get('title1'),$params->get('code1'));
$row2 = array($params->get('item2'),$params->get('title2'),$params->get('code2'));
$row3 = array($params->get('item3'),$params->get('title3'),$params->get('code3'));
$row4 = array($params->get('item4'),$params->get('title4'),$params->get('code4'));
$row5 = array($params->get('item5'),$params->get('title5'),$params->get('code5'));
$row6 = array($params->get('item6'),$params->get('title6'),$params->get('code6'));
$row7 = array($params->get('item7'),$params->get('title7'),$params->get('code7'));
$row8 = array($params->get('item8'),$params->get('title8'),$params->get('code8'));
$row9 = array($params->get('item9'),$params->get('title9'),$params->get('code9'));
$row10 = array($params->get('item10'),$params->get('title10'),$params->get('code10'));

//Set up accordion



echo '<script type="text/javascript">
window.addEvent("domready", function(){
            var accordion = new Accordion("h5.atStart", "div.atStart", {
                opacity: false,
                onActive: function(toggler, element){
                    toggler.setStyle("color", "'
.$headercol.'");
                },
                
                onBackground: function(toggler, element){
                    toggler.setStyle("color", "'
.$headercolbg.'");
                }
            }, $("accordion"));
            
            
            
        }); 


</script>'
;

if(
$layout==1){
//Place user snippets in accordion structure
$myitems = array($row1,$row2,$row3,$row4,$row5,$row6,$row7,$row8,$row9,$row10);

echo 
'<div id="accordion" style="margin-top:'.$margintop.'px;margin-bottom:'.$marginbottom.'px">';
    foreach (
$myitems as $myitem){
        if(
$myitem[0]==1) {
            echo 
'
                    <h5 class="toggler atStart">'
.$myitem[1].'</h5>
                    <div class="element atStart">
                        '
.$myitem[2].'
                    </div>'
;
        }
    }    
}
else {
$myitems = array($row1,$row2,$row3,$row4,$row5,$row6,$row7,$row8,$row9,$row10);

    echo 
'<div id="submenu">';
    echo 
'<h3 class="sub">Treatments</h3>';
        foreach (
$myitems as $mytitle){
            if(
$mytitle[0]==1) {
                echo 
'<h5 class="toggler atStart">'.$mytitle[1].'</h5>';
            }
        }    
    echo 
'</div>';
    echo 
'<div class="page_text">';

        foreach (
$myitems as $mypanel){
            if(
$mypanel[0]==1) {
                echo 
'<div class="element atStart">'.$mypanel[2].'</div>';
            }
        }        
    echo 
'</div>';    
}
The problem is that the js code only works for the traditional layout (title above content) How can I write the js to work for both layout positions??

Thanks