当溢出隐藏时只获得可见图像

Question

我有一个html结构显示为图像。当容器被设置为溢出隐藏时，有没有办法获得那些不完整可见的图像（最后一行）？我能够获得隐藏的图像。

Answer 1

您可以使用此自定义选择器查找未超出其父级的元素：

jQuery.extend(jQuery.expr[':'], {
    inparent: function(el) {
        var $el = $(el),
        parent = $el.parent();
        if ($el.offset().top >= parent.offset().top && 
            $el.offset().top + $el.outerHeight(true) <= parent.offset().top + parent.outerHeight(true) && 
            $el.offset().left >= parent.offset().left && 
            $el.offset().left + $el.outerWidth(true) <= parent.offset().left + parent.outerWidth(true)) 
        {
            return true;
        }
        return false;
    }
});

然后，您可以使用以下方法找到部分或完全隐藏的图像：

var visibleimg = $('#container > img:not(:inparent)');