Tous nos scripts

Slider

Avoir un slider infini

<script>
document.addEventListener('DOMContentLoaded', function() {
    let wrappers = document.querySelectorAll('.clients_items-wrapper');
    let lastWrapper = wrappers[wrappers.length - 1];
    let items = document.querySelectorAll('.clients_item');
    for (let i = 0; i < items.length; i++) {
        let clonedItem = items[i].cloneNode(true);
        lastWrapper.appendChild(clonedItem);
    }
});
</script>

Etape 1 - Ajouter le script sur la page ou le projet Webflow

<script>
document.addEventListener('DOMContentLoaded', function() {
    let wrappers = document.querySelectorAll('.clients_items-wrapper');
    let lastWrapper = wrappers[wrappers.length - 1];
    let items = document.querySelectorAll('.clients_item');
    for (let i = 0; i < items.length; i++) {
        let clonedItem = items[i].cloneNode(true);
        lastWrapper.appendChild(clonedItem);
    }
});
</script>
Copier

Etape 2 - Ajouter les attributes correspondants

Nom

Valeur

Nom

Copié !

Valeur

Copié !

Nom

Valeur

Nom

Valeur

Tuto, template & scripts

Tuto

Template

Script

<script>
document.addEventListener('DOMContentLoaded', function() {
    let wrappers = document.querySelectorAll('.clients_items-wrapper');
    let lastWrapper = wrappers[wrappers.length - 1];
    let items = document.querySelectorAll('.clients_item');
    for (let i = 0; i < items.length; i++) {
        let clonedItem = items[i].cloneNode(true);
        lastWrapper.appendChild(clonedItem);
    }
});
</script>
Copier

Etape 2 - Ajuster le code pour votre besoin

  • Avoir un élément au sein d'une slide englobe un autre (ici .clients_items-wrapper)
  • Avoir un élément au sein d'un .clients_items-wrapper qui englobe les autres éléments (ici .clients_item)
  • Il faut aussi changer la propriété sizing de votre class .clients_item pour la mettre en "Dont's shrink or grow"
Copié dans le presse-papiers
Logo Justa

Progressez sur Webflow

Oops! Une erreur s'est produite lors de la soumission du formulaire.