Je souhaite obtenir des informations sur une formation complète concernant le thème DIVI dispensé
par un organisme de formation certifié par l’état.
Que la formation soit finançable par mon CPF (idéalement) ou autre


Publié dans: Incorporer – – Youtube

Vous utilisez probablement une image fixe comme arrière-plan de votre site Web, mais cela peut offrir une expérience plus riche et plus immersive si vous envisagez d’ajouter des images en mouvement comme une animation ou un clip vidéo à lecture automatique à l’arrière-plan de vos pages Web.

La page d’accueil Bing utilise souvent Arrière-plans vidéo, comme ceux-ci Les pingouins sautent un trou de glace à la fois, et il suffit de quelques lignes de code pour intégrer des arrière-plans vidéo sur vos pages Web.



Arrière-plan vidéo YouTube

Il existe plusieurs approches ici:

  • Bing utilise le HTML5 standard <video> Pour diffuser des tags Vidéos sur la page d’accueil. La vidéo intégrée est de taille fixe et ne change pas de taille avec le navigateur.
  • Il existe des plugins jQuery prêts à l’emploi. Tubulaire et BigVideo.js Par exemple, vous pouvez facilement utiliser n’importe quelle vidéo ou une série de vidéos comme arrière-plan de la page.
  • L’autre approche plus simple, comme vous pouvez le voir dans cette démoutilise des balises HTML et CSS (pas de JavaScript) pour placer des vidéos YouTube en arrière-plan de la page.

Arrière-plans vidéo YouTube

Tout d’abord, collez le code suivant près de l’ouverture <body> Jour de votre modèle Web. Vous devez également remplacer l’ID par l’ID vidéo réel de la vidéo YouTube que vous souhaitez utiliser en arrière-plan.

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
  <iframe frameborder="0" height="100%" width="100%"
    src="https://youtube.com/embed/ID?autoplay=1&controls=0&showinfo=0&autohide=1">
  </iframe>
</div>

// Replace ID with the actual ID of your YouTube video

En interne, nous utilisons les balises IFRAME de YouTube pour intégrer la vidéo afin qu’elle occupe toute la page (la largeur et la hauteur sont définies sur 100%). En outre, le Z-index est défini sur négatif, de sorte que la couche vidéo YouTube apparaît plusieurs couches sous le contenu principal de votre page.

L’inconvénient est que votre vidéo d’arrière-plan ne fonctionnera pas sur les appareils mobiles et qu’il ne sera pas possible de couper le son d’une vidéo sans utiliser JavaScript.

Incorporer la musique de fond dans l’audio YouTube

Rappelez-vous l’ère Geocities où les sites Web diffusent automatiquement une musique de fond dès que vous les ouvrez au grand embarras des employés de bureau. Ils utilisaient principalement des fichiers audio bruts tels que MP3, WAV ou même le format MIDI pour incorporer de la musique, mais vous pouvez également utiliser l’une de vos pistes YouTube préférées pour incorporer de l’audio en arrière-plan.

L’astuce consiste à intégrer une vidéo YouTube normale (avec lecture automatique = 1) et à définir la hauteur et la largeur du lecteur vidéo sur zéro afin que l’élément IFRAME intégré reste invisible. Cela peut être réalisé avec une seule ligne de code que vous pouvez ajouter n’importe où sur votre page Web.

<embed height="0" width="0"
  src="http://youtube.googleapis.com/v/VIDEO_ID&autoplay=1&loop=1" />



Source link

Recent Posts