上升时停止滚动效果

时间:2017-07-31 21:05:18

标签: javascript jquery html css

大家好,所以我有一个简单的效果,当一个人向下滚动内容将从左右等飞入。然而我想要发生的是当用户向上滚动时,内容保持不变,所以如果有意义,每次刷新只会发生一次效果:)

    <div class="row">
       <div class="col-xs-12 col-sm-6 col-md-6" data-aos="fade-right" data-aos-easing="ease-in-sine">
       <h1> 1</h1>
       <span class="border"></span>
       <p> 2 </p>
        </div>
     <div class="col-xs-12 col-sm-6 col-md-6" data-aos="fade-left" data-aos-easing="ease-in-sine">
     <img src="Images/number1.png" style="padding-top: 20px;">
        </div>
    </div>

JS:

       AOS.init({
  duration: 1200,
})

我已使用此插件Link用于效果

谢谢

1 个答案:

答案 0 :(得分:1)

看起来您可以添加到元素中的属性

data-aos-once="true"

可以添加以防止项目第二次动画。

https://github.com/michalsnik/aos#-advanced-settings