Question

我使用航点来触发特定元素。下面的div元素都有相同的类，所以我试图触发id，然后find元素的类，然后`addClass（'fadeDisplay'）。

最初我尝试为它创建一个函数来减少代码，但是一旦我无法得到'$（this）to work with it, I attempted to do it by writing each specific element, like this $（'＃section3-box-img1'）`。

我的班级没有添加，并且航点元素在正确的位置开火。

有人看到我做错了吗？

<div class="section3-box-img" id="section3-box-img1"></div>
<div class="section3-box-img" id="section3-box-img2"></div>
<div class="section3-box-img" id="section3-box-img3"></div>

var section3img = $('.section3-box-img');
$('#section3-box-img1').waypoint(function() {
//section3Fade();
    $('#section3-box-img1').find(section3img).addClass('fadeDisplay');
}, {
    offset: '75%'
});
function section3Fade() {
    $(this).find('.section3-box-img').addClass('fadeDisplay');
}

Answer 1

尝试使用'this'关键字。像这样：

<div class="section3-box-img" id="section3-box-img1"></div>
<div class="section3-box-img" id="section3-box-img2"></div>
<div class="section3-box-img" id="section3-box-img3"></div>

var section3img = $('.section3-box-img');
$('#section3-box-img1').waypoint(function() {
    $(this).addClass('fadeDisplay');
}, {
    offset: '75%'
});

Answer 2

刚刚删除了查找功能。（如果你使用的是id，我不知道你为什么要找这个班级）。尝试下面的东西。

$('#section3-box-img1').waypoint(function() {
//section3Fade();
    $('#section3-box-img1').addClass('fadeDisplay');
}, {
    offset: '75%'
});

function section3Fade() {
    $(this).addClass('fadeDisplay');
}

Answer 3

$("[id^='section3-box-img']").waypoint(function() {
    $(this).addClass('fadeDisplay');
}, {
    offset: '75%'
});

使用find触发具有自己的id的类

3 个答案: