Question

我有一个固定的面板，其内容滚动并用div分隔。当任何内容的div TOP到达TOP时，我会发出警告，出现在该div的类中。

每个div都有一个类似<div class="section-proceso anc1">的类（每个div都包含两个类，以section-和anc开头，如果需要，可以添加新类）

我尝试了这样的事情没有结果：

if ($("div[class^='anc']").offset().top >= $('.contentPanel').offset().top){
   alert($(this).attr('class'));
}

Answer 1

每次滚动发生时都必须触发代码，因此请将其放在容器的滚动事件处理程序中。
在您的选择器中，您正在检查类属性，其属性值为section-proceso anc1，section-proceso anc2等。没有一个以＆＃39; anc＆＃39;开头。因此，您必须将其更改为anc1 section-proceso或使用contains选择器（*）。
如果div达到或高于容器使用小于或等于＆＃39; （<=）比较器，而不是＆＃39;大于或等于＆＃39; （>=）。

试试这个：

$(function(){
    $(".contentPanel").scroll(function(){
        $("div[class*='anc']").each(function(){
            if ($(this).offset().top <= $('.contentPanel').offset().top)
               console.log($(this).attr('class'));
        });
    });
});

小提琴：http://jsfiddle.net/nyCKE/5009/

Answer 2

使用此：

$(".contentPanel").scroll(function () {
    $("div[class*='anc']").each(function() {
        $this = $(this);
        var TopView = $('.contentPanel').offset().top;
        var TopElement = $this.offset().top;
        if (TopElement <= TopView && !$(this).hasClass('Appear')){
            $(this).addClass('Appear');
            alert($(this).attr('class'));
        }

        if (TopElement >= TopView && $(this).hasClass('Appear')){
            $(this).removeClass('Appear');
            alert($(this).attr('class'));
        }
    });
});

你从来没有看到alert的最后一部分，因为你提到了＃34;当任何内容的div TOP到达面板TOP时，会显示该div类的警告。＆＃34;并且最后一部分的顶部永远不会到达面板顶部。

注意：Appear课程用于防止每次滚动时出现重复提醒，只有在到达某个部分时才能看到提醒，当您到达部分末尾时，Appear课程已经已移除，因此您只有在从顶部或底部到达某个部分时才能看到警报，并且在将部分表格向上或向后滚动时不会看到重复的恼人警报。

<强> Check JSFiddle Demo

当节的顶部等于或高于主面板的顶部时，类警报

2 个答案: