Bonjour,
Je rencontre un problème avec le plugin jQuery slick carousel et je n'arrive pas à le résoudre.
En ce moment, je développe un site pour un client et j'ai 3 pages avec un slider chacun ayant des options différentes. Le slider/plugin en question est celui-ci. J'ai un problème de chargement avec le 3ème slider et dans la console le message suivant apparait: "uncaught out of memory". Je ne comprends pas trop ce problème. Je ne suis pas expert en javaScript et encore moins dans la gestion de mémoire (je ferai des recherches sur ce sujet).
La stack technique est basique: un fichier d'entrée index.php qui inclut un header.php et footer.php. Le footer contient le jquery et slick.js appelé en cdn. Les 3 autres pages sont en .php qui incluent le header et footer. Toutes mes fonctions js sont dans un seul fichier index.js.
J'ai essayé de reproduire chez moi le problème avec plus ou moins la même stack technique et options.
Voici mon code js
A ma grande surprise, il fonctionne bien chez moi, en local (pas d'erreur de mémoire), mais ce même code ne fonctionne pas sur le projet en question.
Je sais que c'est un peu flou et que je ne peux pas partager le code source mais si quelqu'un pense avoir une idée, ça m'aiderait énormément.
Edit 1 :
Je viens de me rendre compte que même en local, le site ne réponds plus, lorsque je change de pages trop de fois.
J'obtiens ce message
Merci
Modifié par allan00958 (29 Aug 2020 - 17:59)
Je rencontre un problème avec le plugin jQuery slick carousel et je n'arrive pas à le résoudre.
En ce moment, je développe un site pour un client et j'ai 3 pages avec un slider chacun ayant des options différentes. Le slider/plugin en question est celui-ci. J'ai un problème de chargement avec le 3ème slider et dans la console le message suivant apparait: "uncaught out of memory". Je ne comprends pas trop ce problème. Je ne suis pas expert en javaScript et encore moins dans la gestion de mémoire (je ferai des recherches sur ce sujet).
La stack technique est basique: un fichier d'entrée index.php qui inclut un header.php et footer.php. Le footer contient le jquery et slick.js appelé en cdn. Les 3 autres pages sont en .php qui incluent le header et footer. Toutes mes fonctions js sont dans un seul fichier index.js.
J'ai essayé de reproduire chez moi le problème avec plus ou moins la même stack technique et options.
Voici mon code js
var opt1 = {
dots: false,
infinite: true,
slidesToShow: 4,
slidesToScroll: 1,
speed: 300,
variableWidth: true,
arrows: true,
prevArrow: $('[data-prev="prevButton"]'),
nextArrow: $('[data-next="nextButton"]'),
responsive: [
{
breakpoint: 769,
settings: {
slidesToShow: 2,
slidesToScroll: 1,
}
},
]
}
var opt2 = {
dots: false,
infinite: true,
slidesToShow: 1,
slidesToScroll: 1,
speed: 300,
arrows: true,
prevArrow: $('[data-prev="prevButton"]'),
nextArrow: $('[data-next="nextButton"]')
}
var opt3 = {
dots: false,
infinite: false,
slidesToShow: 3,
slidesToScroll: 0,
speed: 300,
arrows: false,
centerMode: false,
variableWidth: true,
prevArrow: $('[data-prev="prevButton"]'),
nextArrow: $('[data-next="nextButton"]'),
responsive: [
{
breakpoint: 1197,
settings: {
infinite: true,
slidesToShow: 2,
slidesToScroll: 1,
centerMode: false
}
},
{
breakpoint: 769,
settings: {
slidesToShow: 2,
slidesToScroll: 1,
}
},
{
breakpoint: 761,
settings: {
slidesToShow: 1,
slidesToScroll: 1,
}
}
]
}
var gadgetCarousel = $(".slider");
gadgetCarousel.each(function() {
if ($(this).is(".one")) {
$(this).slick($(opt1));
}
else if ($(this).is(".two")){
$(this).slick($(opt2));
}
else if ($(this).is(".three")){
$(this).slick($(opt3));
}
else {
$(this).slick();
}
})
A ma grande surprise, il fonctionne bien chez moi, en local (pas d'erreur de mémoire), mais ce même code ne fonctionne pas sur le projet en question.
Je sais que c'est un peu flou et que je ne peux pas partager le code source mais si quelqu'un pense avoir une idée, ça m'aiderait énormément.
Edit 1 :
Je viens de me rendre compte que même en local, le site ne réponds plus, lorsque je change de pages trop de fois.
J'obtiens ce message
La connexion avec ws://192.168.1.96:8080/browser-sync/socket.io/?EIO=3&transport=websocket&sid=jAtdd_cL2H2oC_fsAAAa a été interrompue pendant le chargement de la page.Merci
Modifié par allan00958 (29 Aug 2020 - 17:59)