我必须在容器内动态地定位弹出元素.我试图获取容器的边框宽度.我发现了几个这样的问题:
How to get border width in jQuery/javascript
我的问题已经讨论过了,但我没有找到任何答案.当财产厚,薄或中等时,您如何获得边框宽度?
街上有一句话,你通常可以预期瘦,中等和厚度分别为2像素,4像素和6像素,但CSS规范不要求.
解决方法
我玩了一段时间,唯一的解决方案,我能够想出这将解决问题是类似于这一点:
var thinBorder = 1; var mediumBorder = 3; var thickBorder = 5; function getLeftBorderWidth($element) { var leftBorderWidth = $element.css("borderLeftWidth"); var borderWidth = 0; switch (leftBorderWidth) { case "thin": borderWidth = thinBorder; break; case "medium": borderWidth = mediumBorder; break; case "thick": borderWidth = thickBorder; break; default: borderWidth = Math.round(parseFloat(leftBorderWidth)); break; } return borderWidth; } function getRightBorderWidth($element) { var rightBorderWidth = $element.css("borderRightWidth"); var borderWidth = 0; switch (rightBorderWidth) { case "thin": borderWidth = thinBorder; break; case "medium": borderWidth = mediumBorder; break; case "thick": borderWidth = thickBorder; break; default: borderWidth = Math.round(parseFloat(rightBorderWidth)); break; } return borderWidth; }
注意Math.round()和parseFloat().那些是因为IE9为瘦而不是1px为0.99px,而厚5-6为4.99px.
编辑
您在评论中提到,IE7具有不同的尺寸,适用于薄型,中型和厚型.
他们似乎只有.5px,这将是很难处理,看到你最需要全数.
我的建议是简单地忽略一个差异的.5px,并承认在使用IE7和更低版本时最可能不注意的缺陷,或者如果你在处理它时调整常量,这很类似于:
var thinBorder = 1; var mediumBorder = 3; var thickBorder = 5; // Will be -1 if MSIE is not detected in the version string var IEVersion = navigator.appVersion.indexOf("MSIE"); // Check if it was found then parse the version number. Version 7 will be 17 but you can trim that off with the below. If(IEVersion > -1){ IEVersion = parseInt(navigator.appVersion.split("MSIE")[1]); } // Now you can simply check if you are in an ancient version of IE and adjsut any default values accordingly. If(IEVersion < 7){ thinBorder = 0.5; mediumBorder = 3.5; thickBorder = 4.5; } /// rest as normal
上述任何一种都不是一个复制粘贴解决方案,而只是一个可以处理这个问题的几种方式的演示.您将自然地将所有这些帮助器包含在单独的函数,插件或扩展中.
在您的最终解决方案中,您甚至可能仍然需要处理浮动和集合问题.
这应该能够让你开始很好.