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
Revoir le teaser Je m'abonne
4,5
Transcription

59,90€ Je commande

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

DescriptionProgrammeAvis
4,5
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é

2 commentaires
4,5
2 votes
5
4
3
2
1
wfischli
Il y a 2 years
Commentaire
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 3 years
Commentaire
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.