![](/img/trans.png)
[英]jQuery mouseleave - mouseenter just work in the First Element
[英]Jquery function is working just on first element, I want to work on all classes
我创建了一个看起来像这样的 Jquery function
jQuery(document).ready(function ($) {
var animations = document.querySelectorAll('.slide-up');
for (var i = 0; i < animations.length; i++) {
var windowHeight = window.innerHeight;
var elementTop = animations[i].getBoundingClientRect().top;
var elementVisible = 140;
if (elementTop < windowHeight - elementVisible) {
animations[i].classList.add("active");
}
else {
animations[i].classList.remove("active");
}
}});
问题是,当我向下滚动时,它只在第一个 class 上工作,我想在每个 class 上工作。我也尝试类似:
jQuery(document).ready( function($){
$('slide-up').each(function($) {
var animations = document.querySelectorAll('.slide-up');
for (var i = 0; i < animations.length; i++) {
var windowHeight = window.innerHeight;
var elementTop = animations[i].getBoundingClientRect().top;
var elementVisible = 140;
if (elementTop < windowHeight - elementVisible) {
animations[i].classList.add("active");
}
else {
animations[i].classList.remove("active");
}
}
});});
但结果相同。当我向下滚动时,关于如何应用于所有具有上滑 class 的元素的任何想法或建议?
提前致谢 !
考虑以下。
jQuery(function($) {
var animations = $('.slide-up');
var windowHeight = window.innerHeight;
var elementVisible = 140;
animations.each(function(i, el) {
var elementTop = $(el).position().top;
if (elementTop < windowHeight - elementVisible) {
$(el).toggleClass("active");
}
});
});
这应该对每个元素执行一个操作。 所有代码已切换到 jQuery。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.