javascript - 向上时停止发生滚动效果

标签 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对于效果

谢谢

最佳答案

看起来您可以向元素添加一个属性

data-aos-once="true"

可以添加它以防止元素再次产生动画。

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

关于javascript - 向上时停止发生滚动效果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45425275/

相关文章:

html - 列设置为 100% 高度的响应式 CSS

Javascript:为什么我的即时搜索功能运行滞后,如何改进?

javascript - 无法使用 dust.js 呈现简单表格

javascript - 如何使用 getStream 更新对象?

javascript - React - 如何从另一个函数内部调用一个函数

javascript - id 为 ="(name)"的 div 我可以使用它吗?

javascript - document.writeln 未正确连接 === 比较

javascript - 弹出框内的旋转木马 - Bootstrap

javascript - 将自定义 CSS 类传递给 Kendo 的下拉小部件

javascript - 使用 JavaScript 在 Safari 中下载文件