主页 / 问题 / 817802
Accepted
Новиков Максим
Asked:2020-04-23 00:45:31 +0800 CST2020-04-23 00:45:31 +0800 CST

图像滚动动画

  • 772

您好，有一个网站https://templated.co/retrospect。

如何制作与本网站相同的滚动图片动画？

javascript

1 个回答

  1. Best Answer

    这不是javascript，这是正常的background-attachment:fixed;

    全屏观看

    * {
  margin: 0;
  padding: 0;
}

.item1,
.item3 {
  width: 100%;
  height: 100vh;
}

.item2,
.item4 {
  width: 100%;
  height: 300px;
  background: #fff;
}

.item1 {
  background: url(http://wallpaperscraft.ru/image/plity_bereg_more_pasmurno_temnota_55483_2560x1080.jpg);
  background-size: cover;
  background-attachment: fixed;
}

.item3 {
  background: url(https://www.motto.net.ua/pic/201209/1920x1080/motto.net.ua-18427.jpg);
  background-size: cover;
  background-attachment: fixed;
}
    <div class="item1 item"></div>
<div class="item2 item"></div>
<div class="item3 item"></div>

    • 3

相关问题