Categorias: jQuery

Slider ou Carrossel Randômico

Escrito por Amanda de Lavra

15 de agosto de 2023
Nesse site, a cliente queria um carrossel de logos randômico. Eram 5 imagens, cada uma com diversos logos. Se eu estivesse usando o módulo Slider do Divi, o plugin Divi Booster tem a opção de randomizar os sliders. Porém, estava usando o módulo Carrossel de Imagens do Divi Flash. Achei o tutorial do Divi Booster mostrando como fazer isso em: https://divibooster.com/randomize-the-divi-slider-module-slide-order/. Então era só uma questão de identificar as classes que o módulo continha e adaptar o código. Primeiro, é necessário adicionar a classe slider-random ao módulo. O código fica assim:
jQuery(document).ready(function($){
    $('.slider-random').each(function() {
        var slides = $(this).find('.swiper-wrapper');
        slides.children().sort(function() {return Math.random()-0.5;}).detach().appendTo(slides);
    });
});

Posts relacionados

Esconder título na imagem em hover no Divi

Esconder título na imagem em hover no Divi

O Divi tem uma coisa muita chata que é aparecer o atributo título das imagens quando passa o mouse em cima delas. Tentei resolver com CSS, mas o código usava a propriedade pointer-events e definia como none. Isso tira não apenas a ação do hover, mas também do click e,...

Botão Leia Mais no Elementor

Botão Leia Mais no Elementor

O site do cliente tinham alguns textos que eram muito extensos e, num layout de coluna, variavam muito de tamanho. Decidi adaptar o que já havia feito no Divi, ao incluir um botão Leia Mais (https://blog.amandadelavra.com.br/modulo-texto-com-botao-leia-mais/), mas...

Cabeçalho diferente ao rolar a página com Divi

Cabeçalho diferente ao rolar a página com Divi

Para o site deste cliente, resolvi fazer dois cabeçalhos diferentes, um maior com várias informações que aparece ao abrir a página, e outro menor e fixo, apenas com o logo e o menu e que aparece ao rolar a página. Achei este tutorial:...