Bonjour,

Pour une version mobile d'un site, je me sert de jquery pour la mise en page donc j'utilise le code suivant pour faire un accordéon sur un bloc :

function redimensionnement(e) {
		var result = document.getElementById('result');
		if("matchMedia" in window) {
			if(window.matchMedia("(max-width:768px)").matches) {
        // menu de gauche en accordéon
        $(".catalogProductDetail figcaption .description p").hide();
        $(".catalogProductDetail figcaption .infosProd").hide();
        $('.catalogProductDetail figcaption h5').click(function(e){
          if($(this).next().is(':hidden')){
            $(this).next().slideDown('normal');
            $(this).css({
              backgroundPosition: "right -22px"
            });
          } else {
            $(this).next().slideUp('normal');
            $(this).css({
              backgroundPosition: "right 1px"
            });
          }
        });
			} else {
			}
		}
	}
	// On lie l'événement resize à la fonction
	window.addEventListener('resize', redimensionnement, false);

	// Exécution de cette même fonction au démarrage pour avoir un retour initial
	redimensionnement();

Cela fonctionne quand je suis à 768px et en dessous mais si dans mon navigateur j'agrandis ma fenêtre et que je la repasse en dessous de 768px alors l'accordéon fonctionne mal (il descend mais remonte aussitôt).
Merci de votre aide !

Salut Fanny !
A mon avis le problème vient de la récurrence d'appel de ta fonction click. Cette fonction est permanente, or lorsque tu manipule la taille de ton écran ce qui pourrait s'apparenter à un changement d'orientation de tablette, cette fonction est appelée 2 fois : une au chargement de la page et une autre au resize de la page. En solution tu devrait mettre une condition autour de la fonction click, exemple :
function redimensionnement(e) {
var result = document.getElementById('result');
if("matchMedia" in window) {
if(window.matchMedia("(max-width:768px)").matches) {
// menu de gauche en accordéon
$(".catalogProductDetail figcaption .description p").hide();
$(".catalogProductDetail figcaption .infosProd").hide();

if(!$('.catalogProductDetail figcaption h5').hasClass('uneFoisPasPlus')){

$('.catalogProductDetail figcaption h5').click(function(e){
if($(this).next().is(':hidden')){
$(this).next().slideDown('normal');
$(this).css({
backgroundPosition: "right -22px"
});
} else {
$(this).next().slideUp('normal');
$(this).css({
backgroundPosition: "right 1px"
});
}
$('.catalogProductDetail figcaption h5').addClass('uneFoisPasPlus');
});

} //fin verif uneFoisPasPlus

} else {
$('.catalogProductDetail figcaption h5').removeClass('uneFoisPasPlus');
}
}
}
// On lie l'événement resize à la fonction
window.addEventListener('resize', redimensionnement, false);

// Exécution de cette même fonction au démarrage pour avoir un retour initial
redimensionnement();

Logiquement,cela doit fonctionner.

Bonjour Romuald,

Je pensais t'avoir répondu il y a quelques jours mais je constate que non (je deviens gaga!)
Donc merci en effet cela fonctionne, il y a quand même un moment où cela ne fonctionne plus mais je ne parviens pas à identifier exactement quand j'ai l'impression que c'est un peu aléatoire, mais c'est seulement après plusieurs redimensionnement donc ce n'est pas grave (il n'y a que des gens comme nous pour tester 50 fois la même chose!)

Merci de ton aide !