使用 jQuery 检测容器溢出?

2024-05-15

我见过这个问题 https://stackoverflow.com/questions/2059743/detect-elements-overflow-using-jquery但感觉必须有一个“更干净”的 jQuery 方法来做到这一点。我什至不确定这是否真的适用于所有场景。 jQuery 有没有办法在不比较尺寸的情况下确定容器是否溢出?

为了澄清一下,有没有一种方法可以测试 CSS 属性是否overflow: hidden已启动并正在隐藏内容?


$.fn.hasOverflow = function() {
    var $this = $(this);
    var $children = $this.find('*');
    var len = $children.length;

    if (len) {
        var maxWidth = 0;
        var maxHeight = 0
        $children.map(function(){
            maxWidth = Math.max(maxWidth, $(this).outerWidth(true));
            maxHeight = Math.max(maxHeight, $(this).outerHeight(true));
        });

        return maxWidth > $this.width() || maxHeight > $this.height();
    }

    return false;
};

Example:

var $content = $('#content').children().wrapAll('<div>');
while($content.hasOverflow()){
    var size = parseFloat($content.css('font-size'), 10);
    size -= 1;
    $content.css('font-size', size + 'px');
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 jQuery 检测容器溢出? 的相关文章

  • CSS3 变换:IE 中的缩放

    我想使用CSS3属性transform scale div transform scale 0 5 0 5 有没有办法在 Internet Explorer 8 及更低版本中模仿这个 可能与filter或者 JavaScript 解决方案
  • 当前元素的警报 ID

    我正在使用以下代码来提醒当前元素的 id
  • 有没有办法动态更改 jqGrid 的单元格值?

    这个问题可能已经被问过很多次了 但我想知道是否可以动态更改 jqgrid 的单元格值 我基本上有一个网格 它通过 JSON 字符串加载数据 在特定列的某些行上 该值可能为 null 因此 预先知道哪个行 ID 是一个问题 然后能够将 nul
  • jquery悬停一次?

    jquery 使悬停函数执行一次然后停止的方法是什么 one 不起作用 button color 2 hover function dosmth 谢谢 Hover http api jquery com hover 绑定处理程序鼠标输入 h
  • 如何让 jstree 节点显示长的、可能是多行的内容?

    当使用jsTree插件 http www jstree com 我需要有一个显示其完整内容的节点 目前 每个节点仅显示大约一行文本 如何让 jsTree 中的节点显示节点中的所有文本而不截断节点的内容 下面的 CSS 代码就可以解决这个问题
  • UpdatePanel 破坏 JQuery 脚本

    这是我想做的事情的简化版本 基本上我有一个数据列表 里面有很多东西 当你将鼠标悬停在数据列表中的项目上时 我希望 jquery 隐藏 显示东西 问题是 在我进行数据绑定后 如果 gridview repeater datalist 位于更新
  • 使用 jQuery inputmask 插件范围 0-100

    如何创建 0 到 100 范围内的掩码 document ready function masked inputmask 您可以使用jquery inputmask regex extensions js为了那个原因 你可以找到带有所有扩展
  • 如何使用CSS缩放图像以填充div并保持纵横比?

    我想用一个 div 填充img 保持纵横比并根据需要拉伸宽度或高度以适应 div style width 80px height 80px img src div 我怎样才能实现它 如果图像不是二次方的 则必须将其 放大 并根据哪一侧较大而
  • Razor mvc3 + jquery + Url 操作 + 部分视图

    我有一个关于 jQuery Razor 的问题 我想使用 razor 和 Url Action 构建一个 javascript 变量 并且 html 属性将是输入的值 像这样 var d1 d1 val var d2 d2 val var
  • Angular SlickGrid 对齐标题文本

    我正在使用角度SlickGrid并希望将列标题中的文本居中或右对齐 并非所有列都以相同的方式 我发现 有一个headerCssClass列定义中的属性 但我一直尝试 这种样式似乎从未被应用 对于列定义 id sourceNumber nam
  • Chrome 版 Firebug Lite 会破坏悬停效果和鼠标悬停事件

    我有一个奇怪的问题 使用时适用于 Chrome 的 Firebug Lite https chrome google com webstore detail firebug lite for google c bmagokdooijbeeh
  • 使用 float:left 与 display:inline-block 的 jQuery UI 拖放排序比较

    我这里有两个例子 这两个例子之间的唯一区别是 一种使用display inline block 另一种使用float left li doc item 显示 内联块 与 li doc item float left 我的问题是 displa
  • jquery 中的函数返回未定义[重复]

    这个问题在这里已经有答案了 我在 jquery 中调用的函数返回未定义 我检查了该函数 当我对其进行调试时 它返回正确的数据 function addToPlaylist component type add to pl value pl
  • 全高全宽 CSS 布局

    我正在寻找一种方法来创建具有 5 个区域的纯 CSS 无 JavaScript 布局 如下所示 H A B C F
  • iphone jquery 移动闪烁问题

    我在 iPhone 上使用使用 jQuery mobile 开发的应用程序时遇到闪烁问题 我尝试了互联网上提供的几种解决方案 包括 CSS 更改 将过渡设置为 无 甚至在 jquerymobile js 中注释代码 但没有运气 我使用的 J
  • .removeClass 从所有元素(相对于单个定义的元素)

    我将如何使用 removeClass 删除所有匹配的类 而不是单独调用每个元素 所以代替这个 input removeClass CO form alert select removeClass CO form alert input se
  • 可以禁用幻灯片的触摸模拟但不能禁用滚动条(危险的滑动器)吗?

    我的页面上有一个危险的滑动器 它成功地模拟了幻灯片和随附滚动条上的触摸事件 允许单击鼠标并移动以向左或向右滑动幻灯片 这很好 但我现在在滑动器内的幻灯片上调用了可拖动 这意味着我需要停止此触摸模拟 拖动幻灯片并同时移动它们会引起混乱 但仅限
  • javascript - 如何获取对象名称或关联数组索引名称?

    我有一个像这样的 JSON 对象 var list name1 element1 value1 name2 element1 value2 如何提取所有 nameX 字符串值 例如 假设我想将它们连接在一个字符串中输出 例如 name1 n
  • 当php脚本通过ajax运行时显示进度条

    我有一个通过 ajax 向服务器提交值的表单
  • Flexbox 项目的完美圆形边框半径[重复]

    这个问题在这里已经有答案了 我有类似这样的项目 它们是弹性盒容器内的弹性项目 我的正常尺寸物品 我的物品被挤压 我的 CSS 看起来像这样 body display flex flex direction column align item

随机推荐

  • Android应用主题更换流畅

    我正在开发一个提供白天和夜间主题的项目 我正在更改主题 夜间主题 AppCompatDelegate setDefaultNightMode AppCompatDelegate MODE NIGHT YES 日主题 AppCompatDel
  • Paramiko SSHException 通道已关闭

    我一直在使用 Paramiko 在 Linux Windows 机器上发送命令 它可以很好地在 Ubuntu 机器上远程执行测试 但是 它不适用于 Windows 7 主机 以下是我收到的错误 def unit for event self
  • 更改 Qt OpenGL 窗口示例以使用 OpenGL 3.3

    我正在尝试更改 Qt OpenGL 示例以使用更现代的 opengl 版本 330 似乎合适 所以我做了 在 main cpp 上设置版本和配置文件 设置着色器版本 更改着色器以使用统一 它现在构建没有任何错误 但我只看到一个空白窗口 我错
  • iOS 设置 MKMapView 中心,因此提供的位置位于底部中心

    我有一个 MKMapView 和一个永不改变的 CLLocationCooperative2D 我想做的是将地图居中 以便该坐标将放置在地图的底部中心 我可以用简单的方法将地图集中在这个坐标上 MKCoordinateRegion view
  • 如何修复 ReactiveCocoa(带有 CocoaPods)的安装?

    这里是新手 尝试将 ReactiveCocoa 2 2 4 和 CocoaPods 安装到项目中 但在运行时遇到错误 我用过github 上的这个 podspec https github com CocoaPods Specs blob
  • 将人类日期(当地时间 GMT)转​​换为日期

    我正在服务器上工作 服务器正在向我发送 GMT 本地日期的日期 例如Fri Jun 22 09 29 29 NPT 2018在字符串格式上 我将其转换为日期 如下所示 SimpleDateFormat simpleDateFormat ne
  • 如何发送wei/eth到合约地址? (使用truffle javascript测试)

    我正在尝试将 wei eth 发送到我的 Solidity 合约的地址 该合约具有外部应付回退功能 我下面的 truffle javascript 测试不会导致 instance address 的余额获得任何 wei instance a
  • 如何在 ant 中为 junit 测试设置 file.encoding?

    我还没有完全完成file encoding 和 ant https stackoverflow com questions 1339352 how do i set dfile encoding within ants build xml
  • Perl 是否有相当于 Python 的 `if __name__ == '__main__'` 的功能?

    有没有一种方法可以确定当前文件是否是 Perl 源中正在执行的文件 在 Python 中 我们使用以下结构来做到这一点 if name main This file is being executed raise NotImplemente
  • 如何在 C# / .NET 中创建内存泄漏[重复]

    这个问题在这里已经有答案了 可能的重复 托管代码中是否可能存在内存泄漏 特别是 C 3 0 https stackoverflow com questions 6436620 is it possible to have a memory
  • Visual Studio 2010 可扩展性、MPF 和语言服务

    我正在尝试扩展 Visual Studio 2010 RC 以能够使用自定义编程语言 我尝试做的前两件事是语法突出显示 智能感知功能 很容易完成 感谢 PDC09 中的 Ook 示例 和创建新项目模板的可能性 即能够打开 myproj 文件
  • 使用多级解决方案计算二维网格中的最近邻

    我有一个问题 在 x y 大小的网格中 我提供了一个点 并且我需要找到最近的邻居 在实践中 我试图在 pygame 中找到距离光标最近的点 该点跨越颜色距离阈值 计算如下 sqrt rgb1 0 rgb2 0 2 rgb1 1 rgb2 1
  • JavaScript 原型 - 请澄清

    有人可以帮我理解原型属性吗 我不明白原型属性是函数的属性还是函数内部的属性 假设我们创建以下构造函数 Food 此时 函数 Food 具有 Food prototype 属性 由于 Food 是 Object 的实例 因此这意味着 Obec
  • 如何在之前的 Facebook 身份验证后自动安全地让用户登录?

    用户抱怨他们必须过于频繁地登录 如果身份验证完全基于 Facebook OAuth 那么用户如何在下次访问该页面时自动登录 用户流程示例 用户点击 使用 Facebook 登录 用户通过 Facebook 进行身份验证并被重定向回网站 用户
  • 平滑滚动.net 表单

    您好 我正在 net 中使用表单 并且在运行时动态添加大量链接标签 我将这些链接标签添加到面板并将该面板添加到 winform 当链接标签的数量增加时 表单会显示一个自动滚动条 垂直 现在 当我使用自动滚动向下滚动时 表单在滚动时不会更新其
  • 在 Xamarin 中隐藏软键盘

    如何隐藏软键盘以便在聚焦时显示Entry在 Xamarin forms 便携式表单项目中 我假设我们必须为此编写特定于平台的渲染器 但以下内容不起作用 我创建自己的条目子类 public class MyExtendedEntry Entr
  • 如何配置 IIS 以接受 POST 请求?

    我知道默认情况下 IIS 不接受发布请求 如何更改此设置 有人可以引导我改变这个 一步一步 吗 如果您使用的是 IIS 6 及更低版本 在 IIS 管理屏幕中右键单击您的网站或虚拟目录 去Properties然后去Home Director
  • 在 TypeScript 中实现类型安全的服务注册表

    我想要一个函数根据给定的标识符 例如字符串或符号 返回对象实例 在代码中它可能看起来像这样 define your services type ServiceA foo gt string const ServiceA foo gt bar
  • 将不同的 grViz 组合成一个图

    我想结合不同的DiagrammeR绘制成一个图形 生成的图如下例所示 library DiagrammeR pDia lt grViz digraph boxes and circles a graph statement graph ov
  • 使用 jQuery 检测容器溢出?

    我见过这个问题 https stackoverflow com questions 2059743 detect elements overflow using jquery但感觉必须有一个 更干净 的 jQuery 方法来做到这一点 我什