Как сделать плавное появление объектов на лендинге?

Всем привет, много где видел такой эффект, но не знаю как он называется.
В общем, когда заходишь на сайт, все объекте на сайте (текст, картинки в основном) плавно появляются когда я на него захожу. А также когда крутишь его вниз, происходит такой же эффект. Как будто текст на сайте был невидим, а когда ты крутишь его вниз, он появляется.

В общем, объяснять я толком не горазд, я очень надеюсь что вы поняли меня.
  • Вопрос задан
  • 11004 просмотра
Пригласить эксперта
Ответы на вопрос 4
@spike364
wow.js + animate.css
Ответ написан
AndreyBerezhnoy
@AndreyBerezhnoy
WordPress Developer at The White Label Agency
Animate.css для анимаций.

Для того чтобы анимация воспроизводилась, когда блок попадает видимую область браузера, попробуйте плагин jQuery-viewport-checker
Ответ написан
Комментировать
@Haoss
html-верстальщик
Ответ написан
Комментировать
webstroynet
@webstroynet
При прокрутке - можно воспользоваться очень простым скриптом
<script type="text/javascript">
$(window).scroll(function() {
if ($(this).scrollTop() > 1){  
    $('#ten-hidden').addClass("sticky");
  }
  else{
    $('#ten-hidden').removeClass("sticky");
  }
if ($(this).scrollTop() > 1){  
    $('#sanremo-logo').addClass("sticky");
  }
  else{
    $('#sanremo-logo').removeClass("sticky");
  }
});
</script>


Этот скрипт добавляет class "sticky" элементу с id "sanremo-logo", пример - sanremo-pizza.com появление тени при прокрутке страницы на 1 пиксель, скорость появления можно задать на css transition: all 0.3s;
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы