Mettre une vidéo en arrière plan sur son site | HTML & CSS

Поділитися
Вставка
  • Опубліковано 29 гру 2024

КОМЕНТАРІ • 76

  • @LiveCodeofficiel
    @LiveCodeofficiel  4 роки тому +3

    ▶ Playlist de plus de 30 vidéos regroupant toutes la création de sites de A à Z de ma chaine : ua-cam.com/play/PLwv7KMK8vXi4GDaytPl92SCgo42-jZT9O.html
    🎁 Rejoindre la formation offerte : bit.ly/formation-offerte-livecode
    👑 Passe à la vitesse supérieur et devient autonome avec la formation ultra complète : bit.ly/formation-complete-livecode

  • @mathieuvo642
    @mathieuvo642 2 роки тому +2

    Merci, moi qui suis novice, tu m'as enlevé une épine du pieds après plusieurs mois de recherches infructueux. Bravo.

  • @tropicalroad9708
    @tropicalroad9708 2 роки тому

    Wow ! c'est super bien expliqué et démontré en live !! Un grand merci

  • @Evasi0n83
    @Evasi0n83 4 роки тому +2

    Super ce que tu proposes, des petits tutos simples et intéressants !

  • @gattuso95100
    @gattuso95100 2 роки тому +1

    T'es fort, bravo à toi !

  • @ngafeelbrad
    @ngafeelbrad 8 місяців тому

    Salut ta video elle hyper bien structuré et expliquer super mais moi quand j'ai fini de suivre les instructions sur le positionnement de la video bah j'ai des bande blanche et la barre sur le côté je comprends pas et suis perdu 😭

  • @Redouchkaaa
    @Redouchkaaa 3 роки тому +1

    incroyable , merci !

  • @fumakirikaze7618
    @fumakirikaze7618 2 роки тому +1

    Merci beaucoup pour cette vidéo 👍🏽

  • @voldyilunga3391
    @voldyilunga3391 Рік тому

    Salut grand prof
    Pourquoi chez moi le z-index dans le bloc fait perdre la vidéo et lorsque je met le z-index dans le bloc:: before il ne devient pas transparent ?

  • @francoismonfret8108
    @francoismonfret8108 2 роки тому +1

    Salut top tes video merci !
    J'ai une question comment tu arrives à avoir ton devtools dans une autre fenêtre ça à l'air tellement pratique merci !

    • @LiveCodeofficiel
      @LiveCodeofficiel  2 роки тому +1

      En haut à droite du dev tools tu as 3 petits points, clique dessus et tu pourra choisir si tu veux le décrocher ou non 🙂

    • @francoismonfret8108
      @francoismonfret8108 2 роки тому +1

      @@LiveCodeofficiel Top merci 🙏

  • @kiadyrabenarivo2209
    @kiadyrabenarivo2209 Рік тому

    Yo, trop cool la vidéo ! Sinon j'ai une question... comment faire pour mettre une nav bar, parce que j'ai essayé et ça n'a pas marché

  • @weronikawojtkiewicz9040
    @weronikawojtkiewicz9040 2 роки тому

    Bonjour, ton tuto m'a bien aidé mais j'ai un petit souci, dès que je rajoute des informations à la suite pour faire un site complet, les scroll bars se remettent et ma vidéo dépasse toujours, il y a pas un moyen de mettre la hauteur de la vidéo à 100vh et que la widht soit en auto et qu'elle dépasse mais sans qu'on puisse la voir? Je précise que j'ai une nav par dessus ma vidéo.

  • @ignminuit
    @ignminuit 3 роки тому +3

    Salut ! Déjà merci pour ta formation elle m'as pas mal aidé et ce tuto aussi, mais j'ai une petite question, tu nous montre que tu as déjà fait un bouton pour activé / désactivé le son mais tu nous montres pas comment le faire, un petit tuto si c'est possible s'il te plaît ? :D

  • @strategienumeriquepro
    @strategienumeriquepro 3 роки тому +1

    Salut Mr , c'est super cool ta maniere de montrer. Peut tu nous aider pour la musique stp j'ai essaye la music afiiche mais ne joue pas. merci deja.

    • @LiveCodeofficiel
      @LiveCodeofficiel  3 роки тому

      Ce n'est plus possible maintenant de lancer une musique automatiquement 😉

  • @Seit-Park
    @Seit-Park 2 місяці тому

    Un peu trop rapide sur le tapage des code moi qui débute actuellement une formation , va falloir la regarder plusieurs fois

  • @duckvadoor9597
    @duckvadoor9597 2 роки тому +1

    Merci mec !

  • @Yanis-sg5si
    @Yanis-sg5si 3 роки тому

    Merci pour le tuto, mais j'ai un problème : je n'arrive pas à mettre une autre petite video en premier plan sans qu'elle prenne les dimensions de celle de l'arrière plan
    Comment je peux régler ça ?

  • @nico77
    @nico77 2 роки тому

    excellent, merci pour la vidéo.

  • @bst_bambie1767
    @bst_bambie1767 Рік тому

    ma video reste en bas de page malgres le codage quye tu donne je comprend pas

  • @Scyllalevrai
    @Scyllalevrai 2 роки тому +1

    Bonjour, j'ai fait exactement pareil mais il y a toujours les barres pour scroller à droite et en bas, savez-vous pourquoi ?

    • @LiveCodeofficiel
      @LiveCodeofficiel  2 роки тому

      Est-ce que tu as mis * { overflow: hidden; } ?

    • @Scyllalevrai
      @Scyllalevrai 2 роки тому

      @@LiveCodeofficiel yep, mais j'ai demander de l'aide à quelqu'un et ça marche :)

    • @LiveCodeofficiel
      @LiveCodeofficiel  2 роки тому +1

      @@Scyllalevrai parfait 🙂

  • @thomasvanesson9169
    @thomasvanesson9169 2 роки тому

    salut je suis étudiant en infographie c'est tu comment mettre une vidéo en parallaxe ?

  • @billbacio4890
    @billbacio4890 2 роки тому +1

    Salut je comprend pas très bien le concept de postion relative et absolute, quelqu'un peut m'expliquer svp?

    • @LiveCodeofficiel
      @LiveCodeofficiel  2 роки тому

      Hello tu as cette vidéo que j'ai faite à ce sujet, elle pourra sans doute t'aider :
      ua-cam.com/video/UaUUGxQhwlY/v-deo.html

  • @OFR5086
    @OFR5086 3 роки тому +1

    super video merci

  • @Phenixelle
    @Phenixelle 4 роки тому +1

    tu peut montrer comment tu as fait pour la musique sur l'autre site ?
    moi j'avais mis une musique simplement comme ça :


    mais elle ne se lance pas toujours et c'est surement du a ce que tu as dit.
    mais j'ai déjà vu certains site ou la musique ce lance normalement donc je ne sais pas comment faire.
    Donc si tu peut montrer comment tu as fait pour le bouton play (avec l'animation synchroniser aussi ce serait top) ce serait super c:

    • @LiveCodeofficiel
      @LiveCodeofficiel  4 роки тому

      Je connais aucun sites actuellement avec du son en arrière plan car ce n'est plus autorisé maintenant. Peut être qu'ils arrivent à passer outre avec du JS qui dit que quand la souris se déplace de X pixel, la musique se lance (je sais même pas si ça marche). Pour mon site avec la musique, c'est un énorme script en JS de plus de 500 lignes pour avoir les traits qui bougent et je t'avoue que ça va être impossible pour moi d'expliquer ce script en vidéo. Cependant peut être que je pourrais faire, c'est expliquer comment faite le bouton pour lancer la musique

    • @Phenixelle
      @Phenixelle 4 роки тому +1

      @@LiveCodeofficiel d'accord c'est déjà super
      le site d'ont je parle est le site de genshei impact (le jeu) au lancement ce qui ce produit est assez incroyable (surement du js)

    • @LiveCodeofficiel
      @LiveCodeofficiel  4 роки тому

      @@Phenixelle Je n'ai rien au lancement du site. Tu as une musique toi ?

    • @LiveCodeofficiel
      @LiveCodeofficiel  4 роки тому +1

      ​@@Phenixelle Ah oui en effet je viens de voir sur le site officiel, c'est une sorte de jeu intégré directement. Là ça va au-delà du JS. Je pense même au langage OpenGL pour faire ça.

    • @Phenixelle
      @Phenixelle 4 роки тому +1

      @@LiveCodeofficiel oui c'est assez pousser je trouve leur site est super

  • @pierrelebouc9815
    @pierrelebouc9815 3 роки тому +1

    Salut je viens de voir ta vidéo et elle est incroyable, mais juste j’ai un petit soucis, ma vidéo est en médiocre qualité malgré la qualité de base de ma vidéo et elle veut un peu, aurais tu une solution ?

  • @1jour1meme14
    @1jour1meme14 3 роки тому +1

    Salut juste quand j’écris du texte il ne se place pas sur la photo je ne comprends pas stp j’ai vrmnt besoin d’aide

    • @LiveCodeofficiel
      @LiveCodeofficiel  3 роки тому +1

      Hello, comment ça il ne se place pas sur la photo ? La vidéo là est sur comment mettre une vidéo en arrière plan 😅

    • @1jour1meme14
      @1jour1meme14 3 роки тому

      @@LiveCodeofficiel s’il vous plaît n’auriez vous pas discord?

    • @1jour1meme14
      @1jour1meme14 3 роки тому

      @@LiveCodeofficiel c’est bon

  • @guillaumekeck-pavlidis2601
    @guillaumekeck-pavlidis2601 3 роки тому +1

    Top. Merci

  • @sakouii2786
    @sakouii2786 2 роки тому

    du coup ta video fait combien de seconde ? 5s , 4?

  • @gustinchouloute1907
    @gustinchouloute1907 Рік тому

    Super Livecode

  • @machroubnassim5656
    @machroubnassim5656 4 роки тому +1

    good video !!
    mais tu aurais peut etre du expliquer ce que fait overflow : hidden et Z-index ainsi que le positionement en absolute

    • @LiveCodeofficiel
      @LiveCodeofficiel  4 роки тому +1

      Le z index c'est pour mettre la vidéo en arrière-plan comme ça les éléments que l'on rajoute ne viennent pas se mettre derrière la vidéo mais par-dessus. L'overflow hidden c'est pour masquer les scollbars verticales et horizontales si la vidéo dépasse de son parent et la position absolute c'est pour faire sortir la vidéo et le ::before du flux. Sans ça, il serait impossible de mettre du contenu (textes, images etc.) par-dessus la vidéo. 🙂

    • @machroubnassim5656
      @machroubnassim5656 4 роки тому +1

      @@LiveCodeofficiel bonne reponse 👍

  • @majorsab51
    @majorsab51 3 роки тому +1

    Tu pourrais me dire la police d'écriture utilisée dans le compilateur stp merci

    • @LiveCodeofficiel
      @LiveCodeofficiel  3 роки тому

      Comment ça ? Je n'utilise pas de police d'écriture prédéfinie, c'est celle par défaut.

    • @majorsab51
      @majorsab51 3 роки тому

      @@LiveCodeofficiel tu utilises bien vs code ?

    • @LiveCodeofficiel
      @LiveCodeofficiel  3 роки тому

      @@majorsab51 Oui

    • @majorsab51
      @majorsab51 3 роки тому

      @@LiveCodeofficieltu n'as fais aucun changement ?

    • @majorsab51
      @majorsab51 3 роки тому

      @@LiveCodeofficiel ou c'est peut etre ta police par défaut

  • @legoshi2287
    @legoshi2287 3 роки тому +1

    Bonjour, j'ai essayé pleins de fois mais ma vidéo ne se lance pas

    • @LiveCodeofficiel
      @LiveCodeofficiel  3 роки тому

      Les vidéos ne peuvent plus se lancer automatiquement

    • @legoshi2287
      @legoshi2287 3 роки тому

      @@LiveCodeofficiel Comment je dois faire alors ? Et je peux t’envoyer mon code pour que tu vois ?

    • @LiveCodeofficiel
      @LiveCodeofficiel  3 роки тому

      @@legoshi2287 ce n'est plus possible maintenant

    • @PhilLeChatounet
      @PhilLeChatounet 2 роки тому +2

  • @yannickasensio8032
    @yannickasensio8032 Рік тому +1

    merci

  • @djelloulimouhamed-g3b
    @djelloulimouhamed-g3b Рік тому

    bonjour merci beaucoup

  • @machroubnassim5656
    @machroubnassim5656 4 роки тому +1

    je tiens a ajouter que tout les navigateurs ne lisent pas toutes les extension video

    • @LiveCodeofficiel
      @LiveCodeofficiel  4 роки тому

      Bon à savoir ça ! Je ne m'étais jamais posé la question 🙂

    • @quentinhnx
      @quentinhnx 4 роки тому +1

      @@LiveCodeofficiel Effectivement, personnellement j'ai Safari qui n'exécute pas le autoplay. En revanche, le autoplay s'exécute bien sous Chrome

    • @LiveCodeofficiel
      @LiveCodeofficiel  4 роки тому

      @@quentinhnx Tu utilises bien l'attribut "muted" également ? Les navigateurs n'auto play plus les vidéos la 2ème fois si l'attribut "muted" n'est pas attribué. Malheureusement je n'ai pas safari, je ne peux pas faire de test mais j'ai vu sur stackoverflow qu'il y avait une alternative à ça en lançant la vidéo avec une ligne en Javascript.

    • @quentinhnx
      @quentinhnx 4 роки тому +1

      @@LiveCodeofficiel Au moment où je postais mon commentaire je n'avais pas encore fini la vidéo et c'est seulement après que j'ai vu l'attribut muted. Mais la vidéo ne se lance pas en autoplay une 1ère fois avec safari mais j'ai pu aussi voir qu'il y a une alternative en utilisant Javascript. Dans tous les cas, merci de l'aide et de la réponse

    • @LiveCodeofficiel
      @LiveCodeofficiel  4 роки тому

      @@quentinhnx Ça marche, pas de soucis 🙂

  • @loubnataouzri5091
    @loubnataouzri5091 3 роки тому +1

    160ème LIKE !

  • @blue-sneko4675
    @blue-sneko4675 3 роки тому +1

    Tes videos sont trop bonne

  • @magrigsdesign8469
    @magrigsdesign8469 Рік тому

    merci