Я пытаюсь получить сценарий, который, когда мое видео заканчивается, прокручивает сайт до <main>, но я не могу заставить его работать.Небольшая помощь будет оценена.Я сделал <script>, но он совершенно не работает, и я не могу понять, почему.
Основное в коде - это, конечно, пример.Заранее спасибо за помощь.
<body>
<header>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
var video = $("#myVideo");
function videoScripting(){
setTimeout(function () {
var scrollToBtm = function() {
$("html, body").animate({
scrollTop: $('main').position().top // replace with whatever you want
}, 4000);
};
}, 3000);
}
video[0].onended = function() {
scrollToBtm(); // call function on video.onended if you want
};
}
</script>
<header>
<video controls autoplay width="100%" height="100%" id="myVideo">
<source src="imagens/DisneyIntroFullHD1080p.mp4" type="video/mp4">
</video>
</header>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar10">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse" id="navbar10">
<ul class="navbar-nav nav-fill w-100">
<li class="nav-item">
<a class="nav-link" href="#">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="//codeply.com">Awards</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><img class="w-25 h-25" src="imagens/Walt-Disney-logo.png"></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Characters</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Personality</a>
</li>
</ul>
</div>
</div>
</nav>
<main>
<section class="container-fluid secao1">
<article class="row align-self-center">
<div class="col-3"></div>
<img class="borda col-3 img-fluid" src="imagens/Walt_Disney_2.jpg">
<div class="borda2 col-3 align-self-center">The most iconic animation persona in the world
The men behind that little mouse that’s still part of children’s lifes nowadays
The men behind the Disney empire.
The men with a dream and the will to make it real.</div>
<div class="col-3"></div>
</article>
</section>
</main>