Message d'erreur cannot read property 'box' of undefined"
europe21
Messages postés
65
Statut
Membre
-
europe21 Messages postés 65 Statut Membre -
europe21 Messages postés 65 Statut Membre -
Bonjour, pouvez vous me dire pourquoi la console me dit "cannot read property 'box' of undefined" alors que je prefixe box par carousel qui est mon objet.
voici mon code:
merci beaucoup.
voici mon code:
var carousel = {
box: document.querySelector('.carouselbox')
, next: carousel.box.querySelector('.next')
, prev: carousel.box.querySelector('.prev')
, items: carousel.box.querySelectorAll('.content li')
, counter: 0
, amount: carousel.items.length
, current: carousel.items[0]
, active: carousel.box.classList.add('active')
, navigate: function (direction) {
carousel.current.classList.remove('current');
carousel.counter = carousel.counter + this.direction;
if (this.direction === -1 && carousel.counter < 0) {
carousel.counter = carousel.amount - 1;
}
if (direction === 1 && !carousel.items[carousel.counter]) {
carousel.counter = 0;
}
carousel.current = carousel.items[carousel.counter];
carousel.current.classList.add('current');
}
, click: function () {
next.addEventListener('click', function (e) {
carousel.navigate(1);
});
prev.addEventListener('click', function (e) {
carousel.navigate(-1);
});
carousel.navigate(0);
}
, clavier: function () {
document.addEventListener("keydown", function (e) {
if (e.keyCode === 37) {
carousel.navigate(-1);
}
else if (e.keyCode === 39) {
carousel.navigate(1);
}
});
},
};
carousel.navigate();
carousel.clavier();
carousel.click();
merci beaucoup.
1 réponse
-
Bonjour,
Le problème c'est que tu définis un objet en faisant appel à lui-même.
Cela n'a pas de sens.
Tu devrais d'abord définir box, puis carousel :var box = document.querySelector('.carouselbox'); var carousel = { box: box , next: box.querySelector('.next') , prev: box.querySelector('.prev') ...
Xavier-
-
voila j'avance ,ce code marche:
var box = document.querySelector('.carouselbox'); var next = box.querySelector('.next'); var prev = box.querySelector('.prev'); var items = box.querySelectorAll('.content li'); var carousel = { counter: 0 , amount: items.length , current: items[0] , navigate: function (direction) { carousel.current.classList.remove('current'); carousel.counter = carousel.counter + direction; if (direction === -1 && carousel.counter < 0) { carousel.counter = carousel.amount - 1; } if (direction === 1 && !items[carousel.counter]) { carousel.counter = 0; } carousel.current = items[carousel.counter]; carousel.current.classList.add('current'); } , nexte: function () { next.addEventListener('click', function (e) { carousel.navigate(1); }); } , preve: function () { prev.addEventListener('click', function (e) { carousel.navigate(-1); }); } , clavier: function () { document.addEventListener("keydown", function (e) { if (e.keyCode === 37) { carousel.navigate(-1); } else if (e.keyCode === 39) { carousel.navigate(1); } }); } , }; carousel.navigate(0); carousel.nexte(); carousel.preve(); carousel.clavier();
-
