Переход страницы с CSS и JQUERY ⇐ Jquery

[Anonymous]

Мне действительно нужна твоя помощь. Я создаю переход страницы, подобный этому: https://codyhouse.co/demo/animated-page ... index.html
Но я следую этой анимации в своем собственном дизайне. https://jsfiddle.net/f7xpe0fo/1/
И он еще не следует за моим дизайном. Чтобы увидеть мой фактический jsfiddle, проверьте его здесь:
https://jsfiddle.net/8y801eqh/11/> Что содержит мой html, что я создал два Dip с основной страницей идентификатора и следующей страницей. Первая страница - цвет красный, а следующая страница - зеленая. По умолчанию я скрываю Div на следующей странице. Проверьте мой html: < /p>

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

Page Transition
[url=#] Click Here[/url]




This is the 2nd page
[url=#] Click Here[/url]


< /code>
Теперь для моего CSS я исправляю их дизайн, чтобы соответствовать всей странице: < /p>
#main-page {
height: 50vh;
width: 100%;
position: fixed;
left: 0;
background-color: #e74c3c;
padding: 40px 0 40px 0;
}

h1{
font-family: Helvetica;
color: #fff;
font-weight: normal;
text-align: center;

}

#next-page{
height: 50vh;
width: 100%;
position: fixed;
left: 0;
background-color: #27ae60;
padding: 40px 0 40px 0;
display: none;
}

a{
font-family: Helvetica;
color: #fff;
border: 2px solid #fff;
padding: 10px 15px;
display: block;
text-align: center;
margin: 0 auto;
width: 20%;
text-decoration: none;
}

На основе моего эксперимента здесь: https://jsfiddle.net/f7xpe0fo/1/> , когда я нажимаю на слово «Нажмите здесь», и это ссылка, она должна завершить страницу на следующую страницу. Я понимаю, что мне нужно использовать jQuery на этом, но как я могу? Может ли кто -нибудь помочь.
Вот собственный jsfiddle: https://jsfiddle.net/8y801eqh/11/

Подробнее здесь: https://stackoverflow.com/questions/308 ... and-jquery