HTML元素的实际大小n Javascript

-2

有什么办法让10000％的人确信HTML元素不可见吗？目前我做的：HTML元素的实际大小n Javascript

var rect = element.getBoundingClientRect(); 

if (element.style.visibility !== 'hidden') && atLeastTen(element.clientWidth, 
     element.clientHeight, element.offsetWidth, element.offsetHeight, 
     element.scrollWidth, element.scrollHeight, rect.height, rect.width) { 
    console.log("Element is visibile!"); 
    return true; 
} else { 
    console.log("Element is invisible!"); 
    return false; 
} 

function atLeastTen() { 
    for (var i = 0; i < arguments.length; i++) { 
     var v = arguments[i]; 
     console.log("CHECKING V:", v); 
     if (v < 10) return false; 
    } 
    return true; 
}

但是，这感觉有点跛...... 想法？

来源

2015-06-25 Merc

是不是'100％'够了吗？ ;-) – Cerbrus

取决于你对“可见”的定义是什么。显然你计算一个9像素×9像素大小的元素不可见？那么零不透明度的元素呢？完全透明的图像？ '显示：none'？空元素与透明背景？视口外的元素？ – JJJ

两个downvotes ...到底是什么？ – Merc

您可能需要检查两件事情：

能见度眼睛和DOM：
1. 检查display。
2. 检查visibility。
3. 检查opacity。
是否在视口内。
1. 获取元素的坐标和尺寸。
2. 获取视口的尺寸。
3. 创建两者的范围。
4. 检查相交。

您可能需要为父母做所有事情！

你可以很容易地使用jQuery或none将它翻译成JavaScript。而刚刚与:visible从jQuery的检查，该文件说：

我们改变背后的逻辑的：可见的：隐藏选择（其中使用jQuery的整个决定的元素的可见性）。

这是怎样的逻辑已经改变：

在jQuery中1.3.1（或以上）的元件可见，如果它的CSS“显示”不是“无”，它的CSS“能见度”不是“隐藏”，并且其类型（如果它是输入）不是“隐藏的”。

在jQuery中1.3.2的元素是可见的，如果其浏览器的报道offsetWidth或的offsetHeight大于0

是什么变化呢？这意味着如果元素的CSS 显示为“none”，或其父/祖先元素的任何显示为 “none”，或者如果元素的宽度为0并且元素的高度为0 那么元素将被报告为隐。

制作此开关有什么好处？结果是双重的：

性能更好，更好，更好。（见下面）

如果元素位于“隐藏”元素中（如果不使用插件，那么以前不可能的元素会报告为“隐藏”）。

简单来说，你可以通过这个小码检查能见度：

$(element).is(":visible");

来源

2015-06-25 09:59:36

HTML元素的实际大小n Javascript

回答

相关问题