Question

我正在开发一个使用inview插件的博客主题来使用J＆amp;滚动K，并将类应用于视图中的文章。唯一的问题是，因为我有一个大分辨率的mac，一次有超过1篇文章在视图中，所以下面的脚本将“inview”类添加到（通常对我来说，3篇文章）几篇文章中时间。有没有办法修改它，所以它只将类“inview”添加到用户屏幕上的第一篇文章？这可能不是页面上的第一篇文章，从技术上讲，这只是少数人中的第一篇。任何帮助表示赞赏。

$('article').each(function(){
        $(this).bind('inview', function (event, visible) {
            if (visible == true) {
                $(this).addClass("inview");
            }

            else {
                $(this).removeClass("inview");
            }
        });
    });

Answer 1

如果我正确理解了您的问题，我认为您可以为.each函数添加索引参数。像这样：

$('article').each(function(index){
        if( index == 0 )
        {
            $(this).bind('inview', function (event, visible) {
                if (visible == true) {
                    $(this).addClass("inview");
                }

                else {
                    $(this).removeClass("inview");
                }
            });
        }
    });

这会将类“inview”添加到第一篇文章中。

Answer 2

您可以随时访问jquery.inview.js第97行，其中显示

$element.data('inview', visiblePartsMerged).trigger('inview', [true, visiblePartX, visiblePartY]);

在此之前，添加

if ($element.prev(".inview").length < 1)

这样它就可以检查是否有一个带有'inview'类的元素，然后才能触发事件'inview'并且显示为visible = true。

jQuery inview只将类添加到视图中的第一个项目

2 个答案: