Gestion d'une Vidéo Fullscreen avec jQuery

Un arrière-plan en video full-screen
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre HTML5 et CSS3 / Part 4 - Aller plus loin avec JavaScript et jQuery
Revoir le teaser Je m'abonne
4,3
Transcription

Cette leçon fait partie de la formation
59,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

DescriptionProgrammeAvis
4,3
Cette leçon fait partie de la formation
59,90€ Je commande

Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Apprendre à gérer une vidéo fullscreen
Comprendre l'utilisation de jQuery pour le dimensionnement dynamique
Optimiser l'intégration vidéo en HTML et CSS

Apprenez à gérer une vidéo fullscreen en utilisant HTML, CSS, et jQuery pour créer des arrière-plans animés pour vos pages web.

Ce tutoriel vous guide à travers la gestion d'une vidéo en fullscreen en utilisant des techniques modernes de HTML, CSS, et jQuery. Vous apprendrez à ajuster automatiquement une vidéo selon la taille de la fenêtre du navigateur, garantissant ainsi une présentation fluide et professionnelle. Le didacticiel couvre également des points essentiels tels que l'autoplay, la mise en boucle de la vidéo, et la gestion des dimensions grâce à des formules mathématiques précises.

En détaillant chaque étape, du code HTML de base à des ajustements avancés via jQuery, ce tuto vous fournira les compétences nécessaires pour intégrer efficacement des vidéos en plein écran dans vos projets web. La vidéo restera fixe en arrière-plan, permettant un défilement du texte ou des autres éléments au-dessus, assurant une utilisation ergonomique et esthétique.

Voir plus
Questions réponses
Quel est le rôle de la fonction ajuste taille dans ce script?
La fonction ajuste taille est utilisée pour redimensionner dynamiquement la vidéo en fonction de la taille de la fenêtre du navigateur.
Pourquoi utilise-t-on l’attribut 'loop' dans la balise vidéo?
L’attribut 'loop' permet à la vidéo de recommencer automatiquement une fois qu'elle est arrivée à la fin, tournant ainsi en boucle.
Quelle méthode est utilisée pour obtenir les dimensions de la fenêtre?
Les dimensions de la fenêtre sont obtenues en utilisant window.innerHeight pour la hauteur et window.innerWidth pour la largeur.

Programme détaillé

3 commentaires
4,3
3 votes
5
4
3
2
1
phbernard
Il y a 2 mois
Formation de bon niveau M Audoux est un professionnel.
Dommage que nous n'ayons pas les fichiers, par ailleurs M Audoux devrait également montré les fichiers CSS
D'autre par les fichiers JS à la version utilisée par M Audoux simplifieraient le travail de l'étudiant.
Azraël
Il y a 3 ans
Bonne formation.
Dommage que M Audoux ne va pas toujours au terme de ses exemples. Il manque souvent un petit "clic" qui finaliserait le cours.
Je rejoins le commentaire précédent, à savoir qu'il manque les fichiers de travail avec lesquels il serait plus facile de s'exercer.
lyazid.meaux
Il y a 4 ans
Très bonne formation, juste ce qu'il faut.
Est il possible d'avoir les exemples afin de pouvoir travailler dessus et ne pas être obliger de jongler entre l'éditeur et la vidéo.

Merci.