滚动后检查元素是否可见 - jquery

Question

我有一个ul元素。我的页面有一个滚动条。我想知道这个元素何时不再可见我做的东西，当这个元素可见时，我做了一些事情。

                    <ul id="categories" class="nav nav-tabs nav-stacked nav-coupon-category nav-coupon-category-left">
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                    </ul>

在stackoverflow上的

，有一些函数，如：

if ($('body').hasClass('sticky-header')) {
    var theLoc = $('#categories').position().top;
    $(window).scroll(function() {

        if(isScrolledIntoView('#categories')){

            console.log('if');

        }else{
            console.log('else');
        }

    });
}

function isScrolledIntoView(elem)
{
    var $elem = $(elem);
    var $window = $(window);

    var docViewTop = $window.scrollTop();
    var docViewBottom = docViewTop + $window.height();

    var elemTop = $elem.offset().top;
    var elemBottom = elemTop + $elem.height();

    return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
}

但它并没有正常工作。