SLIDE DE IMAGENS COM HTML CSS E JAVASCRIPT!

[@lycanxtech2793]

muito legal o video parabéns!

[@cristianoprado4492]

Vc está de parabéns vídeo aula ótima

Cara, você foi show nessa explicação. Muito top seu tutorial. Parabéns!

[@vitorolivera11]

Ficou lindo vou adicionar a ideia na minha página

[@CarlosEduardo-fz9ip]

Muito obrigado amigo, vc é um amigo🤝

[@joaovictorsilvadejesus1664]

Parabéns ficou muitoo bomm!! Sucesso pra o canal, só um parênteses que poderia ajudar, é se vc explicasse melhor oq cada coisa é e o que ela está fazendo, tirando isso, muito obrigado pelo conteúdo!!!

[@denilsonaparecido3315]

Parabéns pelo vídeo mano, top demais!

[@nldsbrito]

Parabéns amigo excelente trabalho, porem fiz exatamente como o tutorial e não sei se esta acontecendo com mais alguém, mais quando clico na seta de retorna a imagem ela não vai para ultima imagem da lista ou ate mesmo não ir ficar parado na atual. o que acontece e que ela retorna como se estivesse uma imagem anterior e fica no background e com isso buga o script e a pagina.

[@jmgame186]

Que tutorial completo mano ! Parabens!!! Me ajudou bastante

[@discovertime9112]

Cara, tem como disponibilizar os arquivos desse video no github?

[@wesleyqueiroz6]

Alguém pode dar um help? Meu slide flui normalmente, vai para direita e ao final volta para a primeira, como deve ser, mas quando está na primeira e clico para ir para última, ela passa da última e para num fundo todo branco e aí não consigo mais voltar e nem avançar, permanece na parte branca. Alguém tem ideia do q poderia ser?

[@moisestaguchi7670]

cara vc ajudou muitoo, porém tem algumas coisas a melhorar ; Acho que nos próximos vídeos vc deve dar mais explicações, afinal vc esta ensinando e não mostrando como digitar o código . Outra coisa espero que seu canal só cresça e que vc tenha bons resultado da para ver que vc é um cara inteligente , focado e muito gente boa ❤

[@VictorSilva-qv1io]

O meu dá o erro que diz que não consegue ler a propriedade "length" nessa primeira linha do cód, eu coloquei ele em um arquivo js separado pq ele estava dando um erro na propriedade 'classlist' nessa linha do cód: document.getElementById('0').classList.add('.imgatual') for(var i=0; i < quant.length; i++) { var div = document.createElement('div') div.id = i balls.appendChild(div) } A seta tá lá, as bolas também, mas a imagem não passa, já tentei procurar na internet esse erro, mas nada que se encaixe no meu problema, pode ajudar?

[@opensource7408]

document.getElementById('0').classList.add('.imgatual') Retire o ponto "." no "('.imgatual')" Coloque: document.getElementById('0').classList.add('imgatual')

[@emersonpessoa05_10]

Parabéns. Tua explicação ficou show. Qual é teu Github?

[@gabrielgoncalves2231]

Obrigado cara, você é o cara

[@TeuSpnl]

Bom demaais!

[@albenyanacleto3202]

Parabéns e obrigado pelo conteúdo. o meu acontece que as setas não funciona a rolagem das imagens, apenas as bolinhas, o que poderia ser?

[@CarolLimex]

Faz alguns vídeos JavaScript para iniciantes, sendo o uso na pratica.. Como esse que você postou

[@ludlopes]

O meu não está dando certo, pode me ajudar? Aparece o erro: "Uncaught TypeError: Cannot read property 'classList' of null"

[@opensource7408]

@Ludmilla Lopes ouve erros no código e arrumei durante o Vídeo, para eu te ajudar precisaria de como está o seu código e em qual linha está o erro.

[@opensource7408]

Verifica a mensagem nos 16:08 minutos do vídeo, supostamente esse deve ser o erro :)

[@ludlopes]

@@opensource7408 O erro foi onde eu apliquei o JavaScript. Fiz um arquivo .js à parte e no HTML tinha aplicado no head. Consegui corrigir, obrigada!

[@thiagozotarelli4105]

Ficou muito bom, porém sou iniciante e o js ficou confuso, mas valeu.

[@rodlange]

Como faço pro slider ficar responsivo? O slider "original" está com imagens em 900px e o responsivo está em 300px. Quando mudo o "imagem.style.marginLeft = -900*atual*'px'" pra -300px, no original movimenta apenas meia imagem. Quando deixo 900px, o responsivo movimenta 3 imagens.

[@opensource7408]

Faz uma variável para armazenar esse -900 e -300, quando tiver normal a variável tem o valor de -900, e quando "estiver no responsivo" a variável muda para -300, depois é só colocar (nome da variável)*atual+"px"

[@tdeyvid]

deu certo fazer responsivo. pode da a dica ?

[@rodlange]

@@tdeyvid cara, como o cliente tinha pressa, eu não fiz responsivo. Fiz uma solução estática mesmo no responsivo. Coloquei display none no slider e coloquei uma foto no lugar.

[@codegois]

Boa mano, manda muito!

[@XANDY1984BR]

Olá td bem... esse exemplo de javascript eu consigo chamar ele no

[@vitorhugodeoliveiraporfiri5081]

Cara, quando troco as imagens as balls trocam também, mas a ball da imagem anterior fica selecionada, e quando todas as imagens passam, todas as balls ficam selecionadas, consegue me ajudar?

[@weslleycarlos8328]

disponibiliza o código fonte mano no Github, por gentilezaaa

[@pamelaalinycletopavan5961]

Caso eu queira acionar o botão next e voltar, com as 'setas do teclado', como eu faria?

[@opensource7408]

Você adicionaria um EventListener aonde uma tecla é "pressionada" e se caso a tecla pressionada for as setas realizaria tal ação: document.addEventListener('keyup', (e)=>{ if(e.key == 'ArrowLeft'){ atual-- slide() } else if(e.key == 'ArrowRight'){ atual++ slide() })

[@carolf228]

Pode me dar uma ajuda? Tá funcionando ok, mas no seu, conforme as imagens vão passando, o background da ball só fica branco na imagem atual, as demais ficam sem background. No meu, todas as balls ficam com background branco, como se todas ficassem checked, sabe?, ignorando qual seja a imagem atual. Consegue me dizer o que pode estar acontecendo? Acho que é no javascript, mas fiz igual o seu. Quais linhas define o comportamento das balls? No caso, para apenas a ball da imagem atual ficar com background branco

[@opensource7408]

Olá Carol, Verifica esse trecho: for(let i=0; i < quant.length; i++){ var div = document.createElement('div') div.id = i balls.appendChild(div) } document.getElementById('0').classList.add('imgAtual') E também se esse trecho está dentro da function slide: document.querySelector('.imgAtual').classList.remove('imgAtual') imagem.style.marginLeft = -1024*atual+'px' document.getElementById(atual).classList.add('imgAtual') Caso o JS estiver tudo correto como no vídeo, verifica o HTML e o CSS. Espero ajudar

[@carolf228]

@@opensource7408 o erro todinho estava no classList.remove('imgAtual'), pus um ponto ('.imgAtual') 🤦🏻 obrigada

[@joaovictorsilvadejesus1664]

@@carolf228 Eu tmb kkk

[@carolf228]

@@joaovictorsilvadejesus1664 resolveu?

[@mgdosbobesponjas3205]

Poderia disponibilizar os arquivos para download por favor, eu manjo muito pouco e pra mim é bem mais fácil já pegar os arquivos prontos e editar

[@codingwithgeorge]

Como eu faço para adicionar texto também, por exemplo, o texto e a imagem rolando no carrossel?

[@DarkScreen-vh7wy]

Muito bom, porém, o meu não rodou as imagens, vc poderia disponibilizar o código para que eu possa descobrir o erro no meu código?

[@Detudoumpouco-nh6zd]

o meu tbm

[@cajuxx1227]

Ótimo vídeo!!!

[@feldevmoura]

Estou com um problema: Posso passar infinitamente como se tivesse outras imagens e quando faço isso não consigo mais voltar para aonde as imagens estavam.

[@feldevmoura]

Meu auto complete tinha escrito "lenght" ao invés de length aaaaaaaa

[@aks-dt-9785]

O meu infelizmente não rodou as imagens, tem como liberar o codigo?

[@wendeus8946]

as bolinha do carousel elas ficaram branca quando passa, e não o branco até reiniciar a página o que eu faço?

[@opensource7408]

Não entendi

[@wendeus8946]

@@opensource7408 já arrumei

[@pauloricardosantos3540]

Ola boa tarde, pode me ajudar??? esta dando erro no meu codigo, está aparecendo essa mensagem: script.js:46 Uncaught TypeError: Cannot read properties of null (reading 'classList'). o erro está nessa linha de código: document.querySelector('.imgAtual').classList.remove('imgAtual') Meu código está identico ao seu, será q deu esse erro pois excluiu a divs internas da div "balls", onde estava a class="imgAtual"? ME AJUDA POR FAVOR.

[@opensource7408]

Opa desculpa demorar para responder, mas já resolveu?

[@FernandoRodrigues-nv1rg]

@@opensource7408 opa amigo, tenho o mesmo problema do "Cannot read properties of null (reading 'classList')", tem como disponibilizar o código?

[@axiew492]

coisa linda

[@Alex62266]

O Meu está quase perfeito, Exceto pelo fato que: for(let i=0; i < quant.length; i++){ var div = document.createElement('div') div.id = i balls.appendChild(div) } está dobrando a quantidade de balls no slide, quando comento ele, fica exatamente com a quantidade de Divs que está no HTML... Alguém pode me ajudar?

[@pietro1972]

no HTML a última div de classe "balls" tem que deixar em branco o conteúdo, pois os botões serão adicionados no JS

[@renan6846]

como posso colocar texto nos slides?

[@amazobusiness6248]

Primeiramente parabens pela iniciativa . Foi um excelente video. Agora como faz para deixar responsive? Sua didatica é muito boa.

[@CharlesCQ]

Poxa eu não consegui ! Vou tentar revisar o código outra hora; Uncaught TypeError: Cannot read properties of null (reading 'classList') X (html) No resource with given URL found

[@CharlesCQ]

CONSEGUIIIIIIIIIIII Estava colocando meu script src no meu head e nao no meu body !

[@PietraCelly]

obRIGADAAAAAAAAAAAA

[@physicalreleasesalert]

só faltou deixar o código pra nós kkkk

[@nathaliaramos7258]

Muito bom!! Mas você poderia colocar o link do seu github?

[@tdeyvid]

alguém tem o código por favor

[@rickkmarks3488]

Código saiu todo bugado, e nem deixou um link para ele, tive que fazer tudo do zero e ainda não dar certo....

[@ismaelmartins2953]

tinha q deixar o código em algum repositório

[@Rougra787]

comigo aparece 3 bolinhas a mais

[@gabrielbithencourt2122]

não tem um jeito de fazer isso sem tanto código

[@bukqueiroz]

impressão minha ou o cara cortou o vídeo várias vezes, fez edições e não gravou?

[@robotelet2659]

Pls send code pls