jQuery检查元素在可滚动div中是否可见

Question

好的，我使用下面的代码来检查一个元素在屏幕上是否可见。

(function($) {

/**
    * Copyright 2012, Digital Fusion
    * Licensed under the MIT license.
    * http://teamdf.com/jquery-plugins/license/
    *
    * @author Sam Sehnert
    * @desc A small plugin that checks whether elements are within
    *     the user visible viewport of a web browser.
    *     only accounts for vertical position, not horizontal.
 */

$.fn.visible = function(partial) {

    var $t            = $(this),
        $w            = $(window),
        viewTop       = $w.scrollTop(),
        viewBottom    = viewTop + $w.height(),
        _top          = $t.offset().top,
        _bottom       = _top + $t.height(),
        compareTop    = partial === true ? _bottom : _top,
        compareBottom = partial === true ? _top : _bottom;

  return ((compareBottom <= viewBottom) && (compareTop >= viewTop));

};

})(jQuery);

但是，我想使用这段代码，以便检查它在可滚动元素中是否可见。特别是我在主要内容中使用的主标签。我将如何修改这段代码，使其适用于我的可滚动元素？我不太确定该怎么办。我已经尝试过将$w变量更改为$('main')，但这似乎很奇怪。

Answer 1

但是，我想使用这段代码，以便检查它在可滚动元素中是否可见。

该插件仅限于检测身体的直接子代。这使得插件无法检测到任何嵌套元素。看这个解释。