como HACER un CARRUSEL en HTML y CSS y JAVASCRIPT 🚀

En este tutorial aprenderemos como hacer un carrusel en html y css y javascript
Signos : ``
Archivos base :
drive.google.com/drive/folder...

[@Ccottite]

Excelente vídeo, muchas gracias, sigue subiendo contenido, realmente es muy bueno, nuevo sub.

[@quentipereira9760]

muy bueno, gracias!

[@elkinmurillo5623]

excelente video te lo agradezco de corazon me sirvió mucho, se le puede agregar efecto dragger para mover con mousover?

[@bryplay0095]

Lo hice en sublimetext y no funciona el JS, soluciones??

[@danielyepes4157]

🙏

[@saritavi]

Era más productivo haber compartido el código completo y en el video hacer una explicación de porqué funciona, no solo escribir el código para que los demás copien...

[@CharlieFBarassi]

con copiar también se puede hacer practica y practica. ya depende de uno ahi

[@jeirismanzueta3367]

Ami no me aparece el boton!! Donde es que esta?

[@jeampool-gamer3717]

amigo en el archivo css no hay ningún estilo , pero igualmente gracias

[@andreszhu394]

Hola divcode!!, he estado probando esta página, pero no me funciona. Podrías subir tu proyecto para ir comparando en qué he fallado? He estado mirando en los archivos base, pero solo está el documentos HTML, en el CSS y JS está vacío. Gracias, un saludo.

[@koutaplay3568]

ya lo solucione revisa mi comentario

[@brayansilvadavila8119]

@@koutaplay3568 y tu comentario esta???? Porque no lo veo

[@harvihinostrozarojas6969]

Y si quiero q sea infinito el slider, ppdrias hacer un vídeo explicandolo porfa

[@AngelHernandez-ke3jy]

el ccs me aparece en blanco

[@MrZonaextremo]

para carousl y carrusel no es lo mismo verdad?

[@fabriciohernandez6822]

Buen vídeo, puedes subir tu script, te lo agradecería muchísimo 😊

[@EdmadrizOficial]

cree uno con IA drive.google.com/file/d/1CFboiG3VtOhZzAzophPglbCQORgeComd/view?usp=share_link

[@nahiralvarez4249]

hola como estas? me podrias ayudar con la parte de script? no me funciona y en los archivos no aparece, gracias

[@galaxymg9873]

solucionaste?

[@EdmadrizOficial]

cree uno con IA drive.google.com/file/d/1CFboiG3VtOhZzAzophPglbCQORgeComd/view?usp=share_link

[@koutaplay3568]

@@galaxymg9873 ya encontré la solución revisa mi comentario

[@SIMPLEMENTEGUST]

hola buenas tardes ya coloque todo como va pero la función de las flechas no se cumple

[@user-kx9of2ug7c]

Lo mismo me pasa

[@domingo161]

Consulta, porque en las clases pones carrusel y en otras carousel? Cual es la diferencia?

[@juandiegoruiz-ir1uu]

amigo son solo nombres que se le dan para poder llamarlos en el css

[@MiriamRSanchez]

¿A alguien le ha funcionado el tutorial? a mi no me sale y no se porque si ya revise todo y no hay diferencias entre lo que hace el chico y lo que hago yo D,:

[@PinguyBros]

todo muy bien hasta que llegue al ts jajajaj es que yo uso angular, ayudaaaaaa

[@lucianososa1470]

Ayuda, por algun motivo una vez termino el css solo me queda la palabra carrusel y no me aparece el carrusel que puedo hacer?

[@alguienconcuenta70]

puede que sea porque no tienes enlasado el css al html.

[@jesuscorral7101]

css y el script están vacíos

[@rociogerez8270]

no me salio:(

[@antonygonzark]

no hay nada en el css ni en el script, seria ideal que lo tuviera

[@divcode7383]

Hola intentare subirlos saludos

[@josecarlosguzmanperez7645]

@@divcode7383 y hasta ahora nada, que chafa tu canal

[@Elvisccs151]

@@josecarlosguzmanperez7645 quieres todo fácil? así nunca vas a aprender

[@HolaBuenas-it9ww]

Nefasto. 43 minutos donde no explica nada, tarda en escribir y el código finalmente no funciona. Asi es la mayoría de gente que hace tutoriales y saturan a los que somos nuevos mientras cobran por reproducciones, tiempo, y circulacion por el video, ojala te lo borren.

[@javiergamarracamacho]

que perdida de tiempo, no funciona tu js

[@braiancardozo9903]

hola bro a mi me sale un error que dice
app.processingButton(event) no es un funcion de html element buttom
(app.processingButton is not a function
at HTMLButtonElement.onclick)

[@johannava3186]

A mí también y no sé cómo solucionarlo

[@khaosjimena]

@@johannava3186 function App() {}
App.prototype.processingButton = function(event) {
const btn = event.currentTarget;
const carruselList = event.currentTarget.parentNode;
const track = event.currentTarget.parentNode.querySelector('#track');
const carrusel = track.querySelectorAll('.carrusel');
const carruselWidth = carrusel[0].offsetWidth;
let leftPosition; // Declarar leftPosition aquí
const trackWidth = track.offsetWidth;
const listWidth = carruselList.offsetWidth;
track.style.left == "" ? leftPosition = track.style.left = 0 : leftPosition = parseFloat(track.style.left.slice(0, -2) * -1);
btn.dataset.button == "button-prev" ? prevAction(leftPosition, carruselWidth, track) : nextAction(leftPosition, trackWidth, listWidth, carruselWidth, track);
}
let prevAction = (leftPosition, carruselWidth, track) => {
if (leftPosition > 0) {
track.style.left = `${-1 * (leftPosition - carruselWidth)}px`;
}
}
let nextAction = (leftPosition, trackWidth, listWidth, carruselWidth, track) => {
if (leftPosition < (trackWidth - listWidth)) {
track.style.left = `${-1 * (leftPosition + carruselWidth)}px`;
}
}
window.onload = function(event) {
var app = new App();
window.app = app;
}

[@esmeraldagarcia1707]

intenta cambiar en tu html App. por app. resulta que no la reconoce por estar en mayuscula