J'ai mis en place un 'accordeon' RICO qui fonctionne bien par ailleurs, excepté lorsque le contenu d'un panel depasse la taille de celui ci. Je n'arrive pas à integrer un scroll vertical si nécessaire.
Pour gerer ce probleme, d'apres les multiples affichage de source sur les page de chez 'RICO', j'ai pu en déduire ceci :
- styler une div (pour le contenu qui dépasse) avec les propriétés height et overflow ce qui permet théoriquement d'afficher le scroll si nécessaire
- passer lors de la creation de l'accordeon 2 parametres : onHideTab et onShowTab permettant la l'affichage ou non du contenu
je n'arrive pas à comprendre ce onloads.push, un array dont je ne vois pas l'utilité
voici un exemple de mise en place d'un accordeon :
Code : Tout sélectionner
// Biblios RICO
<script language="javascript" type="text/javascript" src="prototype.js"></script>
<script language="javascript" type="text/javascript" src="rico.js"></script>
<script>
var onloads = new Array();
</script>
// debut de l'accordeon RICO
<div id="TestAccordeon">
<div id="tab1">
<div id="tab1entete" class="accordionTabTitleBar">
Tab1
</div>
<div id="tab1contenu" class="accordionTabContentBox">
Contenu du panel 1...
</div>
</div>
<div id="tab2">
<div id="tab2entete" class="accordionTabTitleBar">
Tab2
</div>
<div id="tab2contenu" class="accordionTabContentBox"style="padding-right:0px">
// ici gestion des propriétés height et overflow pour afficher ou pas le scroll vertical
<div id="codeScroller" style="height:200;overflow:auto;">
Contenu du panel2, qui doit gerer le srcoll vertical
</div>
</div>
</div>
</div>
// fin de l'accordeon RICO
// Lancement de l'accordeon
<script>
onloads.push( makeAccordion ); // Je pense que c'est ici que ca marche pas (??)
$('tab2contenu').style.display = 'none';
function makeAccordion() {
var accordion = new Rico.Accordion( 'TestAccordeon', { panelHeight:250, onHideTab: hideTabContent, onShowTab: showTabContent } );
}
function hideTabContent( aTab ) {
if ( aTab.content.id == "tab2contenu" )
$('codeScroller').style.display = 'none';
}
function showTabContent( aTab ) {
if ( aTab.content.id == "tab2contenu" )
$('codeScroller').style.display = '';
}
</script>
, la mise en place de l'accordeon reste exectement la même. Comme quoi, faut pas chercher midi à quatorze heures parfois 