les media queries et l'injection js
Posté : 11 déc. 2022, 16:09
bonjour, je suis en formation pour devenir développeur full stack et donc je débute . Je suis entrain de faire un site pour appliquer et me faire la main .
Je suis actuellement dans une impasse j'ai même questionné chatGPT ^^ . Mais il comprend pas vraiment ce que je veux lui dire ou je m'exprime peut être mal ou troisième option je comprend pas forcement ça réponse bref... Je tente ma chance auprès de réel humain .
Voila mon problème j'ai injecté une class que j'ai défini dans mon CSS mais qui n'existe pas dans mon HTML.
de la façon suivante .
const fixedCancel = document.getElementsByClassName("test");
console.log(fixedCancel);
window.addEventListener("scroll", () => {
if (window.scrollY > 600) {
for (var i = 0; i < fixedCancel.length; i++) {
fixedCancel.classList.remove("anime");
fixedCancel.classList.add("animPosition");
}
} else {
for (var i = 0; i < fixedCancel.length; i++) {
fixedCancel.classList.remove("animPosition");
fixedCancel.classList.add("anime");
}
}
});
Mais voila quand la hauteur de mon écran change ça ne rend plus pareil donc j'ai écris cette même class fictive dans un media queries pensant que celle ci serait automatiquement prise en compte quand mon écran aurait telle hauteur il injecterait celle du media queries il n'en est rien . quel est la méthode pour faire ce que j'ai envie de faire ?
Je suis actuellement dans une impasse j'ai même questionné chatGPT ^^ . Mais il comprend pas vraiment ce que je veux lui dire ou je m'exprime peut être mal ou troisième option je comprend pas forcement ça réponse bref... Je tente ma chance auprès de réel humain .
Voila mon problème j'ai injecté une class que j'ai défini dans mon CSS mais qui n'existe pas dans mon HTML.
de la façon suivante .
const fixedCancel = document.getElementsByClassName("test");
console.log(fixedCancel);
window.addEventListener("scroll", () => {
if (window.scrollY > 600) {
for (var i = 0; i < fixedCancel.length; i++) {
fixedCancel.classList.remove("anime");
fixedCancel.classList.add("animPosition");
}
} else {
for (var i = 0; i < fixedCancel.length; i++) {
fixedCancel.classList.remove("animPosition");
fixedCancel.classList.add("anime");
}
}
});
Mais voila quand la hauteur de mon écran change ça ne rend plus pareil donc j'ai écris cette même class fictive dans un media queries pensant que celle ci serait automatiquement prise en compte quand mon écran aurait telle hauteur il injecterait celle du media queries il n'en est rien . quel est la méthode pour faire ce que j'ai envie de faire ?