MediaWiki:Common.js: mudanças entre as edições
Ir para navegação
Ir para pesquisar
Sem resumo de edição |
Sem resumo de edição |
||
| Linha 50: | Linha 50: | ||
} | } | ||
}, 40); | }, 40); | ||
<script> | |||
document.addEventListener("DOMContentLoaded", function () { | |||
const track = document.querySelector(".carousel-track"); | |||
const items = document.querySelectorAll(".carousel-item"); | |||
const btnLeft = document.querySelector(".carousel-btn.left"); | |||
const btnRight = document.querySelector(".carousel-btn.right"); | |||
let index = 0; | |||
const itemWidth = items[0].offsetWidth + 20; // largura + gap | |||
let autoScroll; | |||
function updateCarousel() { | |||
track.style.transform = `translateX(${-index * itemWidth}px)`; | |||
} | |||
function next() { | |||
index++; | |||
if (index >= items.length) index = 0; | |||
updateCarousel(); | |||
} | |||
function prev() { | |||
index--; | |||
if (index < 0) index = items.length - 1; | |||
updateCarousel(); | |||
} | |||
btnRight.addEventListener("click", () => { | |||
stopAuto(); | |||
next(); | |||
startAuto(); | |||
}); | |||
btnLeft.addEventListener("click", () => { | |||
stopAuto(); | |||
prev(); | |||
startAuto(); | |||
}); | |||
function startAuto() { | |||
autoScroll = setInterval(() => { | |||
next(); | |||
}, 4000); // 4 segundos parado em cada imagem | |||
} | |||
function stopAuto() { | |||
clearInterval(autoScroll); | |||
} | |||
startAuto(); | |||
}); | |||
</script> | |||
Edição das 18h58min de 16 de janeiro de 2026
document.addEventListener("DOMContentLoaded", function () {
const slider = document.getElementById("exclusiveSlider");
const left = document.querySelector(".exclusive-arrow.left");
const right = document.querySelector(".exclusive-arrow.right");
let autoScroll;
function startAutoScroll() {
autoScroll = setInterval(() => {
slider.scrollLeft += 1;
if (slider.scrollLeft + slider.clientWidth >= slider.scrollWidth) {
slider.scrollLeft = 0;
}
}, 25);
}
function stopAutoScroll() {
clearInterval(autoScroll);
}
startAutoScroll();
slider.addEventListener("mouseenter", stopAutoScroll);
slider.addEventListener("mouseleave", startAutoScroll);
left.addEventListener("click", () => {
slider.scrollLeft -= 220;
});
right.addEventListener("click", () => {
slider.scrollLeft += 220;
});
});
function scrollEverlight(direction) {
const track = document.getElementById("everlightTrack");
const scrollAmount = 260;
track.scrollLeft += scrollAmount * direction;
}
/* auto scroll lento */
setInterval(() => {
const track = document.getElementById("everlightTrack");
if (!track) return;
if (track.scrollLeft + track.clientWidth >= track.scrollWidth) {
track.scrollLeft = 0;
} else {
track.scrollLeft += 1;
}
}, 40);
<script>
document.addEventListener("DOMContentLoaded", function () {
const track = document.querySelector(".carousel-track");
const items = document.querySelectorAll(".carousel-item");
const btnLeft = document.querySelector(".carousel-btn.left");
const btnRight = document.querySelector(".carousel-btn.right");
let index = 0;
const itemWidth = items[0].offsetWidth + 20; // largura + gap
let autoScroll;
function updateCarousel() {
track.style.transform = `translateX(${-index * itemWidth}px)`;
}
function next() {
index++;
if (index >= items.length) index = 0;
updateCarousel();
}
function prev() {
index--;
if (index < 0) index = items.length - 1;
updateCarousel();
}
btnRight.addEventListener("click", () => {
stopAuto();
next();
startAuto();
});
btnLeft.addEventListener("click", () => {
stopAuto();
prev();
startAuto();
});
function startAuto() {
autoScroll = setInterval(() => {
next();
}, 4000); // 4 segundos parado em cada imagem
}
function stopAuto() {
clearInterval(autoScroll);
}
startAuto();
});
</script>