Элемент анимации при прокрутке с отключенной прокруткой страницы - PullRequest
Новая
       10

Элемент анимации при прокрутке с отключенной прокруткой страницы

0 голосов
/ 13 июня 2018

Я хочу сделать приветственный экран на сайте, который будет постепенно уменьшаться при прокрутке, но сама страница в этот момент не прокручивается.Когда элемент уменьшится до желаемого значения, страница прокручивается как обычно.Примерно так https://jsfiddle.net/dpaLrk82/4/

JS 

$(window).scroll(function(){
    if ($(".hello").css('height') != "100px") {
        $(window).scrollTop(0)
        $(".hello").css('height', '-=20px');
    }
});

HTML 

<div class="hello">
    <h1>Hello</h1>
</div>

<div class="container">Content</div>

CSS 

.hello {
    min-height: 100px;
    height: 100vh;
    background: #ccc;
}
.container {
    height: 100vh;
    background: #eee;
}

Но это всего лишь скетчи, которые плохо работаютособенно в мобильных браузерах.

Мне кажется, я часто видел эту функцию на целевых страницах.

...