11485 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Ce topic pourrait être dans html, responsive, css ou javascript, désolé si ce n'est pas au bon endroit.
Sur un site que j'ai créé je me rends compte qu'un formulaire est trop complexe pour beaucoup d'utilisateurs. Je cherche donc à créer un Assistant qui posera une à une les questions des champs obligatoires et notera les réponses dans le formulaire à la place de l'utilisateur.
Ce que je souhaite, c'est que l'assistant n'utilise qu'une seule "fenêtre" qui se redimensionnera et se recentrera à chaque clic sur "suivant" ou "retour". Et j'aimerais que les transitions soient douces.
Par exemple : l'écran 1 demande si l'utilisateur souhaite de l'aide. Disons une fenêtre de 500px par 150 avec deux boutons oui/non. Cet écran est centré via CSS (position fixed et translate vu que la taille initiale est connue, etc.). Disons maintenant que l'écran 2 demande de remplir un champ quelconque de largeur 150px. Je souhaiterais que le conteneur de l'assistant prenne la bonne largeur doucement et qu'il se repositionne au centre de l'écran doucement également, pour ne pas perturber l'utilisateur.
J'aimerais beaucoup vos conseils sur la structure html à créer ainsi que sur les techniques CSS ou javascript à utiliser pour arriver à cet effet.
Je suis évidemment ouvert à tout copier/coller de code ou carrément un Codepen, mais vu que je ne pars de rien - seulement une idée - je n'en vois pour l'instant pas trop l'intérêt.

Merci pour vos suggestions.
Bises.