mon menu accordéon ne fonctionne pas ....

erual

Membre actif
21 Juillet 2003
230
1
Bonjour,

J'ai voulu mettre un menu accordéon sur mon site à partir de ce tuto, mais j'ai eu beau m'y reprendre à plusieurs reprises, ça ne fonctionne pas.

Je n'arrive pas à trouver ce qui cloche ...

Quand je regarde sur Safari avec la console erreur, j'ai ce résultat : TypeError: Result of expression 'expandedindices' [undefined] is not an object.

Je pense que c'est quand j'essaie d'adapter ce menu acec KompoZer pour mon site que je dois faire une erreur, mais laquelle ???

Si j'ouvre le fichier menu.html qui se trouve sur mon mac, ça à l'air de fonctionner !!

Merci d'avance pour vos conseils
 

erual

Membre actif
21 Juillet 2003
230
1
Bonsoir,

Remplacez votre fichier menu.html par le fichier original que vous avez téléchargé sur ma page et vérifiez son bon fonctionnement.
  • Si le fichier original fonctionne en ligne, on continue (étape par étape).
  • Si ce n'est pas le cas , mieux vaut laisser tomber l'idée du menu en accordéon.

c'est ce que j'ai fait (2 fois déjà !)

votre fichier original fonctionne
j'ai modifié étape par étape (la longueur des boutons, couleur des polices, liens ...) et publié également étape par étape
j'étais arrivée à un menu qui me convenait parfaitement et qui fonctionnait, mais le lendemain plus rien ! incompréhensible !!
 

erual

Membre actif
21 Juillet 2003
230
1
J'ai recommencé avec la Fraise plutôt qu'avec KompoZer et pour le moment, ça marche !!

les mystères d'iWeb et mobileMe ....

J'espère que ça tiendra ....
 

erual

Membre actif
21 Juillet 2003
230
1
Bien le menu accordéon continue de bien fonctionner et il est donc à recommander

Mais j'aimerai réduire ou supprimer l'espace blanc entre les différents titres du menu, mais ne sais comment faire .....
 

koeklin

Membre expert
Club MacG
17 Août 2007
2 366
249
Il va falloir se débarrasser des balises de titres h3. Remplacez toutes les balises de ce type
Bloc de code:
<h3 class="menuheader expandable">Nom de votre catégorie</h3>
par
Bloc de code:
<div class="menuheader expandable">Nom de votre catégorie</div>

puis au milieu des balises de style vous avez le paragraphe
.arrowlistmenu .menuheader{ /*CSS class for menu headers in general (expanding or not!)*/ etc.
Dedans changez la valeur de la ligne
Bloc de code:
margin-bottom: 10px; /*bottom spacing between header and rest of content*/
 

callimetrie

Membre enregistré
27 Avril 2011
1
0
Bonsoir,

Je cherche depuis quelques heures pourquoi le menu déroulant que j'essaie d'inclure sur ce site ne fonctionne pas...

J'ai suivi le tuto, je crois que le problème viens du fait que je ne publie pas sur mobileme mais sur rapidomaine. Pas moyen de trouver le fichier auquel fait référence le petit logiciel gratuit recommandé.

J'ai essayé de prendre le truc à l'envers et de tout simplement créer le widget avec le code directement dans la case appropriée... Marche pas non plus.

Je suis plus que débutante en code (d'ou iweb...) Suis je passée à coté de quelque chose d'important ?

Merci de vos réponses !
 

koeklin

Membre expert
Club MacG
17 Août 2007
2 366
249
la methode utilisée est obsolète. C'est bizarre, je suis quasiment sûr que Mireille de ClubiWeb a déjà utilisé une méthode plus simple pour ce type de menu.

Coller ce code dans un widget fragment HTML et vous aurez votre menu

Bloc de code:
<form>
<select class="monmenu" onchange="parent.window.location=this.value">
<option selected >Titre du menu </option>
<option value="url de la page 1">Titre de la page 1</option>
<option value="url de la page 2">Titre de la page 2</option>
<option value="url de la page 3">Titre de la page 3</option>
<option value="url de la page 4">Titre de la page 4</option>
</select>
</form>

il n'y a rien d'autre à faire (pas de massreplaceit)

si vous voulez le même style de couleurs que celui de clubiweb
vous collez cela avant le code donné ci-dessus, dans le même widget :
Bloc de code:
<style type="text/css">
.monmenu {
background-color: #000000;
color: #CCCCCC;
font-size: 8pt;
font-family: verdana;
font-weight: normal;
}
</style>
Vous pouvez aussi éditer cette partie du code pour choisir d'autres polices et d'autres couleurs
 
Dernière édition: