MediaWiki:Common.js: mudanças entre as edições

De Farmland
Ir para navegação Ir para pesquisar
← Edição anteriorEdição posterior →
Adm.mayuka (discussão | contribs)
Burocratas, Administradores da interface, Administradores
5 356 edições
Sem resumo de edição
Sem resumo de edição
Linha 1: Linha 1:
document.addEventListener("DOMContentLoaded", function () {
<script>
    const slider = document.getElementById("exclusiveSlider");
let currentIndex = 0;
    const left = document.querySelector(".exclusive-arrow.left");
let autoScrollInterval;
    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) {
function scrollEverlight(direction) {
     const track = document.getElementById("everlightTrack");
     const track = document.getElementById("everlightTrack");
     const scrollAmount = 260;
     const items = track.children;
     track.scrollLeft += scrollAmount * direction;
     const itemWidth = items[0].offsetWidth + 18; // largura + gap
}


/* auto scroll lento */
     currentIndex += direction;
setInterval(() => {
     const track = document.getElementById("everlightTrack");
    if (!track) return;


     if (track.scrollLeft + track.clientWidth >= track.scrollWidth) {
     if (currentIndex < 0) currentIndex = items.length - 1;
        track.scrollLeft = 0;
     if (currentIndex >= items.length) currentIndex = 0;
    } else {
        track.scrollLeft += 1;
     }
}, 40);


<script>
     track.scrollTo({
document.addEventListener("DOMContentLoaded", function () {
        left: itemWidth * currentIndex,
     const track = document.querySelector(".carousel-track");
         behavior: "smooth"
    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", () => {
     restartAutoScroll();
        stopAuto();
        prev();
        startAuto();
    });
 
    function startAuto() {
        autoScroll = setInterval(() => {
            next();
        }, 4000); // 4 segundos parado em cada imagem
    }
 
    function stopAuto() {
        clearInterval(autoScroll);
    }
 
    startAuto();
});
</script>
/* ===== CARROSSEL EVERLIGHT ===== */
.everlight-carousel {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 25px 0;
}
}


/* Área rolável */
/* Auto-rolagem: anda → para → centraliza */
.everlight-carousel-track {
function startAutoScroll() {
     display: flex;
     autoScrollInterval = setInterval(() => {
    gap: 18px;
        scrollEverlight(1);
     overflow: hidden;
     }, 4000); // 4 segundos (pode mudar para 3000 ou 5000)
    scroll-behavior: smooth;
    width: 100%;
    max-width: 1000px;
}
}


/* Cada imagem */
function restartAutoScroll() {
.everlight-carousel-track .img-hover {
    clearInterval(autoScrollInterval);
     flex: 0 0 auto;
     startAutoScroll();
}
}


/* Botões */
document.addEventListener("DOMContentLoaded", startAutoScroll);
.carousel-btn {
</script>
    background: rgba(0,0,0,0.6);
    color: #fff;
    border: none;
    width: 42px;
    height: 42px;
    font-size: 22px;
    cursor: pointer;
    border-radius: 50%;
    transition: background 0.2s ease;
    z-index: 10;
}
 
.carousel-btn:hover {
    background: rgba(0,0,0,0.85);
}
 
.carousel-btn.left {
    margin-right: 10px;
}
 
.carousel-btn.right {
    margin-left: 10px;
}
 
/* Mantém seu hover */
.img-hover img {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
 
.img-hover img:hover {
    transform: translateY(-6px) scale(1.03);
    box-shadow: 0 10px 20px rgba(0,0,0,0.25);
}

Edição das 19h07min de 16 de janeiro de 2026

<script>
let currentIndex = 0;
let autoScrollInterval;

function scrollEverlight(direction) {
    const track = document.getElementById("everlightTrack");
    const items = track.children;
    const itemWidth = items[0].offsetWidth + 18; // largura + gap

    currentIndex += direction;

    if (currentIndex < 0) currentIndex = items.length - 1;
    if (currentIndex >= items.length) currentIndex = 0;

    track.scrollTo({
        left: itemWidth * currentIndex,
        behavior: "smooth"
    });

    restartAutoScroll();
}

/* Auto-rolagem: anda → para → centraliza */
function startAutoScroll() {
    autoScrollInterval = setInterval(() => {
        scrollEverlight(1);
    }, 4000); // 4 segundos (pode mudar para 3000 ou 5000)
}

function restartAutoScroll() {
    clearInterval(autoScrollInterval);
    startAutoScroll();
}

document.addEventListener("DOMContentLoaded", startAutoScroll);
</script>
Disponível em “http://farmland.net.br/wiki/index.php?title=MediaWiki:Common.js&oldid=336”