Tworzymy przycisk Scroll To Top - PrestaShop 1.7
   22/01/2022 17:17:27    Komentarze 0
Tworzymy przycisk Scroll To Top - PrestaShop 1.7

Chcesz ułatwić nawigację po sklepie swoim klientom? Przycisk powrotu do góry strony jest niezbędny, zobacz jak go stworzyć samodzielnie

Zobacz poradnik








* {
    scroll-behavior: smooth;
}

.to-top {
    position: fixed;
    bottom: 50px;
    right: 50px;
    color: #575757;
    border: 2px solid #575757;
    opacity: 0;
    pointer-events: none;
}

.to-top.active {
    opacity: 1;
    pointer-events: auto;
    cursor: pointer;
}

.to-top i {
    font-size: 3rem;
}





const toTop = document.querySelector(".to-top")

window.addEventListener("scroll", function() {
    if (window.pageYOffset > 300) {
        toTop.classList.add("active")
    } else {
        toTop.classList.remove("active")
    }
})





<a href="#header">
    <span class="to-top"><i> class="material-icons">expand_less</i></span>
</a>

Więcej postów:

Komentarze ()

Zostaw komentarz