检测，如果事情是不是在用户的观点，而从隐藏的溢出隐藏

因此，例如加价：检测，如果事情是不是在用户的观点，而从隐藏的溢出隐藏

<div class="overflow"> 
    <ul> 
     <li> 
      <a href="#">1</a> 
     </li> 
     <li> 
      <a href="#">2</a> 
     </li> 
     <li> 
      <a href="#">3</a> 
     </li> 
    </ul>         
</div>

第一li和第二li是对用户可见。鉴于overflow: hidden，第三个太大而无法显示。但据jQuery的使用有疑虑：

$('.selected').is(':visible')

总是返回true，因为它不具备display: none等

CSS：

.overflow { 
    overflow: hidden; 
    width: auto; 
    max-width: 490px; 
}

有谁知道如何检测是否元素是可见的溢出隐藏的div内？

来源

2011-12-22 Jamie Hutber

您需要比较<li>项的顶部与溢出格的scrollTop()。

$('li').each(function(){ 
    oScrollTop = $('.overflow').scrollTop(); 
    var thisItemIsVisible = ($(this).position().top < oScrollTop); 
    console.log('This LI is Visible: ' + thisItemIsVisible); 
});

请注意，此代码假定如果li的任何部分是可见的，该项目是可见的。你也可以考虑李的高度。

编辑

如果溢出内容hidden，scrollTop将始终为0，所以你应该在李的顶部位置比较的overflow div的高度。

这是一个工作演示http://jsfiddle.net/qaGpm/。为了演示起见，我改变了溢出hidden到visible ....

来源

2011-12-22 10:24:48 Dutchie432

绝妙的想法。现在就通过这个，感谢您的及时回复。但有一件事，如果我的李将被左移。换句话说，内联我想知道如何让这个工作。我想使用scrollLeft将是多余的，因为.overflow的scrollLeft将始终为0. – 2011-12-22 11:12:14

这就是说。我已经更新了jsfiddle，如果我将它们左移，它也可以工作。令人沮丧，因为我无法看到它在网站上工作。令人困惑的是，我有相同的标记和CSS。我会调查更多。 – 2011-12-22 11:40:13

璀璨:)感谢Dutchie432所以我的问题是元素li的$（this）.position（）。top总是大于oScrollTop，因为页面上面有大约350px的LI，我的标记足够糟糕。啊，你知道什么，它的工作。欢呼声 – 2011-12-22 12:40:16

您可以检查elt.scrollTop()的值是否大于元素的elt.position().top + elt.height()。

但看看这个插件：http://imakewebthings.github.com/jquery-waypoints/ 不知道你确切的问题，但它听起来像它可能是有用的。

来源

2011-12-22 10:23:18 Robin

坎可惜这更多的是滚动的效果，而不是检测如果一个元素通过隐藏隐藏的溢出。 – 2011-12-22 11:20:46

你可以问：

if($('.selected').css('overflow')=="visible") 
{ 
    //DO somthing 
}

来源

2011-12-22 11:01:12 Hadas

仍然返回true。干杯虽然帮助 – 2011-12-22 11:13:37

你需要使用ID而不是类 – Hadas 2011-12-22 11:17:24

没想到这可以与ID一起工作，因为这只是一个选择器。无论如何，欢呼的帮助都一样:) – 2011-12-22 11:34:53

检测，如果事情是不是在用户的观点，而从隐藏的溢出隐藏

回答

相关问题