11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour tout le monde,

J'ai un problème sous Chrome seulement, et juste lorsque j'essaye d'ouvrir une popup vidéo (page d'accueil / presse). Ca blink et je n'ai aucune idée d'où cela vient car sous tous les autres navigateurs cela fonctionne. Bizarre non ?

Lien
Salut

Oué c'est curieux il appel constamment
        $(window).resize(function() {
            clearTimeout(resize_finish);
            resize_finish = setTimeout( function () {
                self.make_layout_change(self);
            }, 11);
        });


Tu as également un Failed to load ressource sur ce script :

<script src="jquery.fancybox.min.js"></script>
Modifié par JENCAL (16 Sep 2019 - 10:58)
Salut Fanny,

Jencal a en effet bien identifié l'origine de ton problème : un code récursif dans le plugin "jQuery-Pinterest-Grid" (https://github.com/ivmelo/jQuery-Pinterest-Grid/blob/master/pinterest_grid.js)

La méthode make_layout_change() est appelée une fois à l'initialisation du plugin puis est appelé au resize de la fenêtre, ça c'est logique.
Le problème est que cette même méthode make_layout_change() appelle la méthode calculate() qui, elle, déclenche en sortie un $(window).resize()... patatras, te voilà dans une boucle infinie extrêmement gourmande en ressources et qui modifie le DOM en permanence (de l'ordre de 100 fois par seconde quand même...)

Donc une solution à tester : supprime ton utilisation de ce plugin :
$('.blog-landing-press').pinterest_grid({
		no_columns: 4,
		padding_x: 20,
		padding_y: 20,
		margin_bottom: 50,
		single_column_breakpoint: 700
	});
	$('#blog-landing-talk').pinterest_grid({
		no_columns: 5,
		padding_x: 20,
		padding_y: 20,
		margin_bottom: 50,
		single_column_breakpoint: 700
	});

et teste si l'ouverture des vidéos dans tes modales est mieux.
Si c'est ça, je pense que tu peux corriger le plugin en supprimant la ligne 121... ou bien utiliser un meilleur plugin (peut-être http://raphamorim.io/waterfall.js ou bien sûr https://masonry.desandro.com/ plus lourd)

Voilà.
Sinon, très cool ton engagement dans le zéro déchet , bravo Smiley biggthumpup
Merci beaucoup MatthieuR ! Tu m'as beaucoup aidé !!
J'ai supprime la ligne et tout est ok maintenant.

Je vais tout de meme voir ton pluggin waterfall.js qui m'a l'air moins epuisant en ressources. Merci !