根据动画滑块上的幻灯片动画多个div？

Question

我需要一个像Website

这样的脚本

根据滚动显示div。

PS：无需点击鼠标或悬停事件即可。

Answer 1

你可以在没有点击事件的情况下使用JQuery

$(document).scroll(function() {
  var y = $(this).scrollTop();
  if (y > 200 && y < 600) {
    $('.magic').fadeIn();
  } else {
    $('.magic').fadeOut();
  }
});

body {
  height: 4000px;
}
.magic {
  display: none;
  position: fixed;
  width: 100%;
  height: 60px;
  border-top: 1px solid #000;
  background: blue;
  z-index: 1;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>this is a simple page keep scrolling... </p>
<div class="magic"></div>
<div class="otherdiv"></div>