Hi
i'm using it into project_vii theme
and is an AJAX menu type "accordion" from: http://openrico.org/rico/demos.page (http://openrico.org/rico/demos.page)
look: http://www.fotosdesarria.com/dautomne (http://www.fotosdesarria.com/dautomne)
to insert it in anycontent.php, put:
in anycontent.php
<?php
starttable("100%", "TABLE TITLE");
?>
<tr><td class="tableb">
<!--MENU -->
<div style="border-bottom: 1px solid rgb(31, 102, 155); margin-top: 6px; border-top-width: 1px; border-top-style: solid; " id="accordionExample">
<div id="panel1">
<div style="background-color:#828282; color:#FFFFFF; font-weight: bold;" id="panel1Header" class="accordionTabTitleBar">
TITLE ONE HEREEEEEEEEE
</div>
<div style="border-style: solid; border-color: rgb(31, 102, 155); border-width: 0px 1px; margin: 0px; overflow: visible; height: 500px;" id="panel1Content" class="accordionTabContentBox">
CONTENT ONE HEREEEEEEEEEEEE
</div>
</div>
<div id="panel2">
<div style="background-color:#828282; color:#FFFFFF; font-weight: normal;" id="panel2Header" class="accordionTabTitleBar">
TITLE TWO HEREEEEEE
</div>
<div style="border-style: solid; border-color: rgb(31, 102, 155); border-width: 0px 1px; margin: 0px; overflow: hidden; height: 1px; display: none;" id="panel2Content" class="accordionTabContentBox">
CONTENT TWO HEREEEEEEEEE
</div>
</div>
<div id="panel3">
<div style="background-color:#828282; color:#FFFFFF; font-weight: normal;" id="panel3Header" class="accordionTabTitleBar">
TITLE THREE HEREEE
</div>
<div style="border-style: solid; border-color: rgb(31, 102, 155); border-width: 0px 1px; margin: 0px; overflow: hidden; height: 1px; display: none;" id="panel3Content" class="accordionTabContentBox">
THE CONTENT THREE HEREEEEE
</strong>
</div>
</div>
</div>
<script type="text/javascript"> onloads.push( accord ); function accord() { new Rico.Accordion( 'accordionExample', {panelHeight:227} ); } </script>
<!--fin MENU -->
</td></tr>
<?php
endtable();
?>
and in your template.html
put:
in head
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/rico.js" type="text/javascript"></script>
<script src="js/util.js" type="text/javascript"></script>
and body:
<body onload="javascript:bodyOnLoad()">
<script type="text/javascript">
var onloads = new Array();
function bodyOnLoad() {
new Rico.Effect.Round( null, 'roundNormal' );
new Rico.Effect.Round( null, 'roundCompact', {compact:true} );
for ( var i = 0 ; i < onloads.length ; i++ )
onloads[i]();
}
showMenuContext()
</script>
now, we need the JS files, waht must be in yourgallery.com/js folder.
what i attack here
ups, i forget the css, to insert into your css theme and play with it
.accordionTabTitleBar {
font-size : 12px;
padding : 4px 6px 4px 6px;
border-style : solid none solid none;
border-top-color : #BDC7E7;
border-bottom-color : #182052;
border-width : 1px 0px 1px 0px;
}
.accordionTabTitleBarHover {
font-size : 11px;
background-color : #828282;
color : #000000;
}
.accordionTabContentBox {
font-size : 11px;
border : 1px solid #1f669b;
border-top-width : 0px;
height: 300px;
padding-top: 0px;
padding-right: 8px;
padding-bottom: 0px;
padding-left: 8px;
}
#accordionExample {
width : 100%;
}