jquery - 在 jQuery 中获取元素的宽度作为 float

标签 jquery html css

我一直在寻找一种方法来获取未四舍五入的元素的宽度。想要这样做的原因是我有几个元素随着 display inline-block 向左浮动,我试图自动调整其中的文本大小,以便它们用完容器 div 的整个宽度。我是这样做的:

  1. 选择较小的文字大小,例如 1
  2. 将所有文字设为该尺寸
  3. 将所有 float 元素的宽度相加
  4. 如果小于容器的宽度,则将字体大小增加一个小值
  5. 重复 2-4 直到达到最大尺寸

问题是总是有未使用的剩余空间。我相信这是因为当我少量增加字体大小(即 0.01)以获得准确的大小时。元素的宽度不会改变,因为它是向下舍入的。我可以继续递增,它们不会改变,直到它决定四舍五入然后总宽度超过限制。这是一个 JSFiddle 显示我在说什么:

http://jsfiddle.net/Pkws3/

javascript 可能有点困惑,但基本上是为了节省时间,它从较大的字体大小增量开始,然后当它达到目标大小时,它会使增量更小以更准确。

我试过使用:

$(this).width()
parseFloat($(this).css("width"))
window.getComputedStyle

但它们似乎都不起作用。

最佳答案

这对我有用:

$(this)[0].getBoundingClientRect().width

来自索拉伦:https://stackoverflow.com/a/18341704/299408

关于jquery - 在 jQuery 中获取元素的宽度作为 float ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13852747/

相关文章:

javascript - 如何将 HTML 代码转换为 JSON 对象?

javascript - jQuery Counter, animation to a total,但我如何包含一个逗号?

JQuery DataTables - 删除 fnFilter 并显示所有结果

html - 更改 YouTube 视频嵌入的背景颜色

html - 内联列被下推

html - #id h1, h2, h3 { } 被之前的 #id h1, h2, h3 { } 覆盖

html - BootStrap 下拉菜单未使用 navbar-inverse 正确设置样式

jquery - 如何制作基于 jquery 工具提示的站点指南?

asp.net - jQuery和WCF服务问题

javascript - 重新渲染 HTML Angular js