Formulario animado con HTML, CSS y Javascript

[@Thelimbers7]

Dios mío!!, explicas de manera excepcional, incluso lo más difícil lo haces comprensible para cualquier persona, deberías ser docente!!

[@Jygproyectosweb]

Soy docente no KZbinr

[@andrealozano4328]

¡Que excelente eres para enseñar! Muchos éxitos en tu carrera y sigue con esa pasión por la enseñanza que nos enriquece a todos los que tenemos el privilegio de encontrarte. Mil bendiciones.

[@brunososa1172]

Me encuentro haciendo un proyecto en React y este video fue de enorme ayuda a crear un formulario simple, completo y super funcional ! Se entiende clarisimo y la verdad queda muy bueno. Muchas gracias por este videazo crack

[@andreafarinon3155]

Hola, estoy teniendo problemas, ejecuto todo el código tal como lo explica pero label sigue quedando sin fijar, sería de gran ayuda que puedas comentarme si te funcionó tal como está ahí o si le hiciste algun cambio. Gracias

[@ingegallolara]

Sorprendente cada cosa que va pasando a medida que agregas el código, me funciona perfecto. Si aún estás por ahí, gracias.

[@juanjoseasturiano755]

Solo puedo decir excelente. Gracias por compartir tus conocimientos y tiempo. Saludos desde España!!!

[@thaisherminia]

Qué gusto seguir las clases de este chico! Gracias por la enseñanza.

[@hectorbustamante5692]

Muy agradecido, no conocía la función "+" del CSS, con este nuevo conocimiento, se me ocurren muchas más efectos, que antes hacía con jquery. Gracias!!

[@luz.en.las.tinieblas8859]

tal cual yo solo pense que se podia hacer con sass Muy buenoo!!!

[@Sherlock24jp]

profe se ha ganado un suscriptor mas ¡¡muchísimas gracias !! me sirvió este tutorial muchísimo

[@joseantonioamayapostigo2542]

eres un fenomeno lo bien que explicas y lo mas importante que todos tus tutoriales funcionan. Gracias

[@csawsecuritycam]

Muchas gracias, explicas muy bien, saludos desde México 😎👌

[@djramonlanit]

Muchas Gracias por explicarlo tan claramente!!! GRACIAS!!!

[@luistahuilanmondragon9862]

Un salido desde México. Gracias por el aporte. El efecto es muy típico de librerías como bootstrap, pero no había tenido oportunidad de hacerlo desde cero.

[@maravargas5929]

Hola buenas noches, recien termino de hacer la practica me encanto. Saludos.

[@gonzalojaviermosquera7266]

Genial! Gracias por explicar con tanto detalle, saludos desde cali. Colombia!

[@miguelvaellosancho3013]

Este vídeo está muy bien explicado y es muy correcto. Para mi gusto le falta, y creo que le daría un salto cualitativo sobre otros vídeos del estilo, es el tratamiento de errores en la parte cliente. Tal vez se pudiera poner algún mensaje en color encarnado debajo del campo erroneo y que desaparezca cuando el error se haya subsanado. Quizás en otro vídeo...

[@Felipe367367]

hola , muy buenos tutoriales, la verdad esos que muestras es lo que a veces, nos hace mucha falta, te he agregar a mi whattsup.. saludos

[@mibg654]

Gracias por tanto, valoro muchisimo todo lo que haces, saludos desde Argentina!

[@quinojuan2]

6 años mas tarde sigue siendo útil. Gracias

[@beatrizbusanichelicari7192]

muchassss graciass!!! me encanta tus explicaciones me ayudan mucho!!!

[@nicupavel6504]

gracias por el aporte me ha servido mucho para mi proyecto, tienes un sobre 1000 en explicar la forma de interactuar y editar código ...mil gracias

[@carloscastillo1875]

Magia Potagia Me encantan tus vídeos Grax!! Como programador le he tomado mas aprecio al diseño Web después de conocer este canal :D

[@the_lobito8956]

di que si!!

[@cristiansegura3352]

Excelente, por favor no deje de subir amigo

[@gerardomontini3579]

muy buena explicacion,un genio profe!!!

[@CJaggerPiscoF]

Gracias, me está sirviendo mucho para realizar mis trabajos en la universidad..!! =D Lo malo que no me reconoce los códigos de Java script en brackets, así que tengo que pasarlo a NetBeans.. gracias sigue así!

[@Henry_vargas]

Gracias Profesor, lo entendí todo... Nuevo suscriptor

[@lobogris2691]

no canceles nada! explicás muy bien!!!

[@JavierLopez-ry8ln]

Que bien explicas. Revisare tu canal a ver que otras cosas interesantes tienes. En JavaScript, no das mucho detalle, pero bueno, son clases de clases las que llamas, así que sería ponerse a investigar un poco acerca de como funcionan esas clases, si tienes algún material o alguna página que me recomiendes, te recibo la recomendación con gusto.

[@jorgegomez4117]

espectacularrrrr, muchas gracias, que deberia agragar que cuando presione el boton enviar salga un pop up diciendome que fue enviado con exito? muchas gracias

[@henolyramirez2551]

Me gusta tu forma de explicar.

[@ElManuub]

Exelente explicación

[@JuanRivera-sj2fr]

Excelente profe... magistral explicacion... que bueno conocer mas de tus proyectos

[@luisdiegoruizbautista7119]

me estoy iniciando en lo que es web y me parece un muy buen video :D gracias profe

[@luisleonardocastillo6502]

Excelente la forma de explicar, gracias por compartir. Saludos cordiales!

[@Just151069]

Muy buen tutorial, felicitaciones. Explicas muy bien. La clase 'fijar' creada en javascript no me esta manteniendo las labels arriba cuando cambia el foco si los inputs contienen datos.

[@luisdiegoruizbautista7119]

verifica el nombre del arreglo, me paso y esa fue la solución

[@Domoambientes]

DE VERDAD QUE ERES UNA GRAN GUIA, POR FAVOR HAZ UNO DE ANGULAR 5, SALUDOS DESDE COLOMBIA

[@valleesteban]

Muy buen video, como todos los de este canal, gracias por compartir tu conocimiento

[@HiroshyRojasSalcedo]

Excelente, yo lo habia visto pero no entendia como integrarlo a mi proyecto. Muchas gracias por el video tutorial amigo 😃

[@JoseFrancisco-wy4nm]

Muy buen profesor, le entendí muy bien siendo que me cuesta mucho trabajo la programación en general. Aunque para saber javascript (en general cualquier lenguaje, pero particularmente este) hay qué leer toda la documentación y saber qué funciones se puede utilizar, porque hay cosas muy intuitivas que aún así siguen confundiéndome. Saludos y gracias!

[@concepcionmorales3343]

excelente video, muchas gracias por explicar las funciones y por sus conocimientos

[@danipapal]

Muy bueno el video, muy bien explicado. la única crítica que te hago es que no deberías usar los atajos de la extensión del VC ya que a los que estamos aprendiendo JS y HTML nos podemos entreverar. Saludos y gracias por el tutorial!

[@hpottstock]

Excelente!! Que buen profe eres. Gracias!

[@tecnicoliquen6126]

Que bonito !!! , Muchas gracias , lo que me ocurre es que con el navegador máximizado las cajas de texto se estiran ocupando todo el ancho de la pantalla....

[@josealfre1650]

ya hice en html y css me falta el scrip, gracias por dar tus conocimientos. ya tiene forma el formulario

[@armandobautistal6560]

Gracias por compartir tus conocimientos y experiencia. Muchas gracias

[@DanyRiveraMkt]

Que herramienta usa para visualizar los cambios en tiempo real??

[@valenzuelahuanostostephani1212]

y en lo de javascript al poner un nombre y picarle a la siguiente el de orreo el los titulos se juntan con lo que yo escribi

[@ardilajoshuar1735]

Muy buen video. Excelente video

[@dabiarguinena1200]

Me da un error con el js, ya es la segunda vez que lo hago, pero sospecho que el problema esta en el html o el css. He seguido todos tus pasos (creo) y no me va, se queda abajo lo de nombre etc.. Podrías pasarme el codigo o algo? Ah en el he utilizado tanto scr como type y nada

[@EmOJaXuElPuNk]

Aun no llego a Js pero entendi bien su sitaxis, gracias

[@jorgeivancardona3918]

Gracias Crack tus vídeos son demasiado buenos

[@polantonymamanigutierrez3718]

Excelentes tus vIdeos me están ayudando mucho GRACIAS

[@zvzartedigital1003]

como me ayudaste !! ... ahora lo que me falta solucionar es q a la hora de hacer click en enviar.... no me lleve al inicio de la pagina..... ya que el formulario esta a la mitad d la pagina..... pero... desde ya muchas gracias!!

[@angelopolack7486]

mi estimado buen dia... seguí todo lo que explicas, cree una cuenta de correo en el cpanel pero no recibo los correos, has un video de como crear cuentas de correo en el cpanel.

[@leonardoguzman9119]

En el z-index si se desaparecen las letras solo pongan (px) -20px, o el pixelaje que usaran ya que se le paso

[@gonzaloalonsorodriguez4929]

Me ha sido muy útil, muchas gracias

[@jorgenicolasgonzalez419]

deberias hacer mas worshop de javascript explicas muy bien.

[@isabellaacostaruiz1835]

1q1²2

[@josedespitiaa9476]

@@isabellaacostaruiz1835 what?

[@cesaraugustopachecoariza4528]

A mí también me gustaría muchos vídeos de Javascript ya que no entiendo muchas cosas, muchas cosas. Saludos desde Colombia

[@DavidBalceiro]

Buenas Tardes, muy buena explicación, pero tengo una pregunta ¿cómo hago para q cuando yo envíe el formulario y sea llenado y me lo envíen como hago para guardar en un archivo lo q me envían o tener el registro o una base de datos? o en un excel... Gracias

[@velascooliverleninyork15-19]

Que tal bro, tengo un error llegó hasta el css me falla el Javascript puesto que al colocar el código y correrlo no importa si pongo o no pongo texto en las las cajas de texto estás se siguen bajando no sé si me podrías ayudar a entender el porque :'v

[@hendersonbautistaprogramar8678]

Tengo el mismo error... Por mas que yo coloque el código no hace su función de quedar fijado el label en la parte superior

[@gustavoreyes7192]

Y a la final nunca dio una solución :v

[@hendersonbautistaprogramar8678]

Ni en Internet sale solución porque el error es de el document. Etc... Porque no esta declarado

[@MrDeluxonic]

Ya revisaste a ver si sale algun error en la consola?

[@hendersonbautistaprogramar8678]

@@MrDeluxonic pues si sale el error de que la variable document no está asignada a un valor...

[@josephcardozo3799]

Excelente workshop, muchas gracias, like y me suscribo

[@edgarsantillan3748]

Excelente explicación, gracias por compartir tu conocimiento

[@eduardoromeroharo7724]

Excelente video.. muy buen video me fue de gran ayuda,explicas excelente... Gracias!!

[@fabriciogomez7307]

Buenas, no me funciona, este es mi codigo js: var inputs = document.getElementsByClassName('formulario__input'); for (var i = 0; i < inputs.length; i++) { inputs[i].addEventLinstener ('keyup', function(){ if(this.value.length>=1) { this.nextElementSibling.classList.add('fijar'); } else { this.nextElementSibling.classList.remove('fijar'); } }); } esta bien vinvulado, alguien podria decirme cual es el error por favor.

[@yandrycarvajal1907]

descubriste en que estaba fallando?

[@fabriciogomez7307]

@@yandrycarvajal1907 no amigo, no tuve tiempo de sentarme a analizarlo. Tenés el mismo problema?

[@yandrycarvajal1907]

@@fabriciogomez7307 si tengo el mismo, estaba revisandolo pero no me sale

[@fabriciogomez7307]

@@yandrycarvajal1907 podría ser que algún métodos utilizado de js ya no funcione actualmente, ya que el vídeo es de hace varios años

[@yandrycarvajal1907]

@@fabriciogomez7307 eso si es verdad, si consigues la solucion estaría bien que me ayudases

[@pipebejarano]

Jean seria muy bueno que enseñaras a validar un formulario con JQuery sin nada de alerts (Y). Gracias por los videos

[@Tizirre330]

tendrás la segunda parte de este vídeo??? mil like para ti excelente, tienes el Don de maestro.

[@Jygproyectosweb]

hola, no hay segunda parte, no recuerdo haber dicho que habría segunda parte

[@Tizirre330]

:( excelente todos tus videos...

[@salazar_wil]

Amigo ... Saludos, excelente, explicas todo muy bien

[@marieAbsolem]

Como siempre, ¡mil gracias!

[@miguelquiroz3481]

Excelente canal hermano y muchas felicidades. Una pregunta, si quisiera poner un combobox en un campo , cómo lo tendría que estructurar? Saludos

[@pablorocha2986]

Ayúdame, me funciona muy bien sin embargo cuando lo quiero hacer en un modal el z_index en el label no funciona como lo puedo resolver???

[@talentobucaramanga]

Muy agradecido, compa una pregunta como envio los datossuministrados por el usuario final a mi hostin y como los almaceno

[@davidalejandrocorrea5355]

Excelente video.... gracias por el aporte

[@jkenettl]

Amigo sos una máquina, muy agradecido

[@minilaptopbachi4santacruz852]

Buen tutorial, aquí aprendí hasta los atajos de Visual Studio Code, otro valor agregado a tu video, lo que no me quedó claro es la estrella que aparece al principio de estilo.css

[@johnericsalvatierragalindo7603]

interesante, donde veo los datos que ingreso por el formulario, gracias.

[@carloseduardogomezlozano491]

Muy bien, se aprende. Cuando explica los procesadores para html5, css3 como Jades, SAS. Gracias.

[@RapidsLoader]

Que lastima que esto ya quedó obsoleto, saludos bro buen video, me ayudó a comprender mejor la logica de los arreglos

[@Henry_Nunez]

Excelente explicación. Muchas gracias 👍

[@samuelcastro9399]

No entiendo por que ANTES de agregar el javascript el label no se queda en su "nuevo" lugar de manera permanente, es decir entiendo por que sube cuando toma el foco pero no entiendo por que baja cuando lo pierde. Creo que es algo relacionado al CSS, tendre que leer más al respecto.

[@emaduddin5374]

I DON'T UNDERSTAND YOUR LANUGUAGE BUT I FOLLOW YOUR TUTORIAL. YOUR TUTORIAL IS AWSOME. PLEASE TRY TO PUBLISH YOUR TUTORIAL WITH ENGLISH.

[@Jygproyectosweb]

+Emad Uddin Sorry, I not speak english

[@AndyHHH7]

It would be better if you learn spanish

[@バンビマーティンデラクルス]

really the not speak english

[@ianlarge9009]

What you could do is put the subtitles of the video in your language, so it would be easier for you, is what I did with the videos in English

[@ramaquai]

Hola Amigo... realmente muy buenos los tutoriales. Hice una web responsive como explica tu tutorial pero quise aplicarle un formulario de envío dentro de la index... la verdad me quedó muy bien el formulario animado... pero no lo puedo hacer reponsive en cuanto al tamaño y altura... el ancho si se achica como muestra tu tutorial, pero queda igual de grande y alto.. se puede arreglar eso?

[@Lapedagogiaesarte]

Gracias amigo, excelente tutorial. Dios te bendiga.

[@RastaBlueLabel]

Hola, me gusto mucho el video. Puedes enseñarme a ver en tiempo real los cambios que realizo, tal cual se ve cuando tu manipulas el css

[@Melvinsch]

ya lo termien bro gracias muy sencillo de hacer

[@canalnoticiaenvidareal451]

Hola, que tal, crack.. una consulta podrias crear el siguiente un Formulario que envie lo datos a una direccion de correo especifica segun el departamento que se seleccione

[@mnwebmodelodenegociosweb3384]

Buena explicación... Felicitaciones

[@bayronricardo]

hola amigo quería saber que tipo de estaciones utilizas pues al principio utilizas tab para lo de form.formulario

[@mauriciomayaorzco7816]

muy bien explicado.... super solo falta un poco mas amplia la imagen

[@madelansilva]

Un genio! Gracias por tanto!!

[@diegoolacua149]

No sé si este código esta bien var inputs = document.getElementsByClassName('formulario_input'); for (var i = 0; i < inputs.length; i++) { inputs[i].addEventListener('keyup', function(){ if (this.value.length>=1) { this.nextElementSibling.classList.add('fijar'); } else{ this.nextElementSibling.classList.remove('fijar'); } }); } No me funciona fijar

[@MiguelAldegunde]

Muchas gracias!!! Muy claro y creativo

[@victorsellan4228]

Que crack!!! Muchas gracias

[@NevinT]

Excelente video maestro el año pasado lo probé pero no logré hacer correr el js hoy lo volví a hacer y igual no pude hacer correr el js .... si me pudiera dar una ayuda esta todo igual que el ejemplo del video lo trabaje en visual estudio code.. de igual manera gracias muchos de los videos me han servido.

[@AdrianAlmestro]

Probaste que el script este abajo del todo en el body? a mi me habia quedado arriba del form que estaba desarrollando y no lo conectaba creo :P

[@mandresblac]

¿Y si en vez de escribir una letra, el usuario deja un espacio con la tecla espaciadora?

[@ferr9976]

Sos un genio!! Muchas gracias

[@diegolycans9903]

Hice la parte del JS pero no me sirve, cuando escribo y paso al siguiente vuelvo se vuelven a bajar las letras, que puede ser?

[@navidcastro4805]

Gracias !!! Explicas muy bien!!

[@katherinesuarez2876]

al agregar el codigo fijar en javascript y hacer la prueba no me queda como ati, ingreso las palabras pero igual bajan los label y tapa el texto

[@SuperEvilFigures]

Si el input para el mensaje tiene más de una línea de texto y hace resize vertical, entonces el label se va recorriendo conforme la altura del input crece. ¿De qué modo se podría modificar este ejercicio para resolver ese detalle?

[@ginesgb]

Muy bueno, solo tengo una duda ¿Cómo lo envía? debo de hacer un fichero otro fichero diferente y configurarlo en el

[@raulrodriguez-yi1ts]

Excelentes tu Vídeos, tiene algúna idea de como hacer un formulario con un multiple select y al haber selecionado traiga de la base datos una información como puedo hacer eso ayuda !!!!!

[@elpibecolon]

hola jean carlos llevo bastante tiempo siguiendo tus tutos... mi pana hablando de este tuto que es buenisimo pero tiene un detalle... si uno quiere autocompletar los campos los lebels desaparecen... como puede uno hacer para que no desaparezcan cuando uno usa autocompletar del navegador?