如何使用对用户实际可见的 CSS 元素进行选择?
真的在荧幕上?
有一个 jQuery 插件,它添加了选择器来帮助您完成查看用户是否可以看到某些内容的任务(ViewPort)。
您可以从这里查看和下载它。
它基本上添加了以下选择器:
$(":in-viewport")
$(":below-the-fold")
$(":above-the-top")
$(":left-of-screen")
$(":right-of-screen")
在你的情况下,我认为第一个是你需要的。 其他的更详细,以确定视觉隐藏对象的位置。
如果您使用 jQuery,请使用 :visible 选择器。$("body").find(":visible")
最好的方法是使用 jQuery:
$('.testClass:visible')
返回在 DOM 中可见的所有具有类“testClass”的元素的数组。
从屏幕到 css 没有连接(仅从 css 到屏幕)。css 无法选择实际的可见元素。
您可以使用 jQuery 来匹配那些(正如 McNaney 提到的)并将它们添加一些现有的 css 类。