Bonjour,
Voila je rencontre un petit problème avec mon code.
Je suis en train de creer mon premier site, il s'agit d'un projet de fin de formation.
Actuelement je m'occupe d'agencer tout les éléments sur la page d'accueil.
Cette derniere contient une balise vidéo et je souhaiterais que la page se positionne automatiquement dessus sans que l'utilisateur n'ait à scroller (le lecteur vidéo serait ainsi au centre de la fenetre).
J'imagine qu'un systeme d'ancre avec du Jquery permettrait de creer cette animation, mais pour le moment je n'y arrive pas par moi meme !
Des idées ??
Merci !
Voici mon code :
Entoure<body>
<header>
<nav>
<div class="logo">
<h3>TDS</h3>
</div>
<ul class="nav-links">
<li class=""><a href="">Acceuil</a></li>
<li class=""><a href="">L'équipe</a></li>
<li class=""><a href="">Activité</a></li>
<li class=""><a href="">Catalogue sonore</a></li>
<li class=""><a href="">Infos</a></li>
</ul>
<div class="burger">
<div class="line1"></div>
<div class="line2"></div>
<div class="line3"></div>
</div>
</nav>
</header>
<div id="nuagedenotes" class="note"></div>
<div id="note1" class="note"></div>
<div id="note2" class="note"></div>
<section class="container">
<article class="article-homepage" id="h1-homepage">
<h1>TERRE DE SONS</h1>
<h3>Sound design, compositions originales, mix et mastering</h3>
</article>
<article class="article-homepage" id="video-TDS">
<video src="video/teaser-tds.mp4" controls>ce fichier ne peut pas etre lu</video>
</article>
<article class="article-homepage" id="form-homepage">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Eos officia in ratione iusto ducimus, neque
nihil quasi provident architecto deleniti pariatur, alias omnis id maiores ipsa minus necessitatibus
natus. Aspernatur sit error hic deserunt saepe illum modi itaque perspiciatis laborum soluta, quos totam
.</p>
</article>
</section>
<a href="#" id="scroll-to-the-top"><i class="fa fa-chevron-circle-up" id="scroll" aria-hidden="true"></i>
</a>
<footer>
<ul>
<li><a href="">CGU</a></li>
<li><a href=""> Contacts</a></li>
</ul>
<div id="reseaux-sociaux">
<a href="#" id="logo-facebook"><i class="fa fa-facebook" aria-hidden="true" id="facebook"> </i></a>
<a href="#" id="logo-insta"><i class="fa fa-instagram" aria-hidden="true" id="instagram"></i></a>
</div>
</footer>
<script src="app.js"></script>
</body>z votre code pour bien le mettre en forme