Эффект плавной прокрутки JavaScript с помощью ScrollIntoView ⇐ Html

[Anonymous]

Хорошо, я пытаюсь получить одну страницу (два элемента div). В основном это экран-заставка, который, когда вы нажимаете «Войти на сайт», плавно прокручивается до «основного сайта». Однако он переходит к нему, а не к плавной прокрутке к элементу.
Как я могу заставить его плавно прокручивать этот элемент без этого эффекта перехода?
Вот мой фрагмент:

Код: Выделить всё

splash = document.getElementById('intro');
content = document.getElementById('content');

function enterSite() {
content.scrollIntoView({
behaviour: "smooth"
});
}

Код: Выделить всё

body {
font-family: 'Archivo Narrow', sans-serif;
margin: 0 auto;
width: 100%;
height: 100%;
}

html,
body {
overflow: hidden;
}

main {
width: 100%;
height: 100%;
position: relative;
}

#intro {
background-image: url(https://i.imgsafe.org/51d0cf26df.jpg);
background-repeat: no-repeat;
background-size: cover;
display: flex;
text-align: center;
height: 100%;
}

#splash {
margin: auto;
width: 40%;
background-color: rgba(56, 56, 56, 0.4);
border-radius: 50px 50px;
}

#splash-p {
width: 70%;
font-size: 1.2em;
line-height: 1.5em;
margin: auto;
text-align: center;
padding-top: 10px;
color: #fff;
}

.btn {
width: 35%;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
}

/* Main Content Page */

article {
position: absolute;
width: 100%;
height: 100%;
background-color: red;
}

Код: Выделить всё

Just a load of text repeated



Just a load of text repeated

Если вы нажмете кнопку, произойдет переход к следующему элементу div, мне нужно, чтобы он плавно прокручивался, а не переходил к следующему элементу div. Используя чистый JavaScript, везде, что я смотрел, кажется, есть плагины или используется jquery.

Подробнее здесь: https://stackoverflow.com/questions/398 ... llintoview