如果要在滚动条上设置动画元素，最好的方法是什么？因为我注意到滚动时它有点滞后。我应该像这样添加课程吗？
$(window).scroll(function() {
if($(this).scrollTop() > 500) {
$(".element").addClass("animateElement");
}
}
或做这样的一个标志。
animateFlag = true;
$(window).scroll(function() {
if($(this).scrollTop() > 500) {
if(animateFlag) {
$(".element").addClass("animateElement");
animateFlag = false;
}
}
}
动画化滚动内容的最佳方法是制作最优化的代码。例如，您可以将Vanilla JS与所描述的标志一起使用，并且还可以在滚动之前查询元素，这将导致如下所示：
var animateFlag = true
var element = document.querySelector(".element")
window.addEventListener("scroll", function() {
if(this.pageYOffset > 0) {
if(animateFlag) {
element.classList.add("animateElement");
animateFlag = false;
}
}
}).element {
background: yellow;
width: 200px;
height: 200px;
margin-bottom: 1000px;
}
.element.animateElement {
background: red;
}<div class="element"></div>本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句