2
respostas

[Dúvida] Carrossel e segundo banner perderam config

Boa tarde, Tive dificuldade em colocar as setas no carrossel e pedi ajuda, pois simplesmente não funcionava como a professora executou. Quando entramos na medida 1728 algumas coisas começaram a conflitar conforme eu fazia o que a professora do curso ensinava. Preciso de ajuda agora, pois o carrossel e segundo banner desconfigiraram e não consigo achar a solução. Segue link do github:

https://github.com/sdcsuzana/corre-o-projeto3

obrigada

2 respostas

Boa tarde,

Se tá dando tanto problema, usa a mesma versão da instrutora (versão 8 do swiper, veja no código assim -> swiper@8). copia e cola, esse head (apaga o que tá no teu):

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AluraBooks</title>
    <link rel="stylesheet" href="reset.css">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://unpkg.com/swiper@8/swiper-bundle.min.css" />
    <link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="styles.css">
</head>

E esse script pra deixar depois da tag de footer e antes de fechar o body

<script src="https://unpkg.com/swiper@8/swiper-bundle.min.js"></script>
    <script>
        const swiper = new Swiper('.swiper', {
            spaceBetween: 10,
            slidesPerView: 3,
            pagination: {
                el: '.swiper-pagination',
                type: 'bullets',
            },
        });
    </script>

Vc precisa fechar a div aqui que tava sem o fechamento no teu código:

<div class="swiper-pagination"> </div>

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

é assim na mesma linha mesmo!

que vai funcionar!

Olá, boa tarde. Obrigada pela disponibilidade, porém não funcionou. Algumas outras coisas foram mexidas com estes novos códigos que me enviou, como sumir as imagens do primeiro carrossel, e então vou deixar como está. O curso está com algumas ferramentas/páginas diferentes hoje em dia e está difícil, como pessoa leiga, acompanhar. Como no caso de um swiper diferente que eu nem sabia que dava pra mudar, o disponível hoje em dia é o 11 e na época do vídeo o 8. Enfim. O supoprte de professores está deixando a desejar, pois já mandei esta mesma dúvida e não houve retorno. Desculpa o desabafo e mais um vez agradeço sua disponibiliade em ajudar.