javascript - 小弟没看懂，画红线的这俩块是什么意思

问题描述

问 题

        $(window).scroll(function() {
            if ($(window).scrollTop() >= $(".cent-line-box").offset().top - $(window).height()/2 + 5 && !$(".history-wrap .cent-wrap li").last().hasClass('show')) {
                $(".cent-line-box").addClass('active');
                $(".cent-line-box .point-h").show();
            }else{
                $(".cent-line-box").removeClass('active');
                $(".cent-line-box .point-h").hide();
            }

            $(".history-wrap .cent-wrap li").each(function() {
                var _this = $(this);
                if ($(window).scrollTop() >= $(this).offset().top - $(window).height() + 260) {
                    _this.addClass('show');
                }else{
                    _this.removeClass('show');
                }
            });
        });

解决方案

第一个框，如果window的滚动条距离顶部的高度大于（.cent-line-box距离父元素的高度减去（window的高度除以2再加5）），并且.history-wrap .cent-wrap li最后一个li没有class show,则执行下面的代码。

第二个框，如果window的滚动条距离顶部的高度大于等于（.history-wrap .cent-wrap li距离父元素的高度减去window的高度再加260），那么久这个li加上show,否则remove .show

这篇关于javascript - 小弟没看懂，画红线的这俩块是什么意思的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！