如何检测CSS3调整大小事件

2024-03-04

CSS3 resize 属性可以分配给任意元素。我正在寻找一种方法来检测 div 上的此类调整大小(我不介意它目前仅在 Firefox 中工作):

div {
  resize: horizontal;
  overflow: hidden;
}

不幸的是,onresize事件似乎没有在 div 上触发。当这种用户实例化的调整大小发生时,如何在 JavaScript 中检测到?

Edit:FWIW 我在 Mozilla 上打开了一份错误报告。如果你想追踪它:https://bugzilla.mozilla.org/show_bug.cgi?id=701648 https://bugzilla.mozilla.org/show_bug.cgi?id=701648


调整大小就像改变风格。因此,可以用变异观察者 https://developer.mozilla.org/en/docs/Web/API/MutationObserver。更具体的ResizeObserver https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver可能更好:

let observer = new ResizeObserver(function(mutations) {
  console.log('mutations:', mutations);
});

let child = document.querySelector('textarea');
observer.observe(child);
<textarea></textarea>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何检测CSS3调整大小事件 的相关文章

随机推荐

  • 无法访问用户控制组件[关闭]

    Closed 这个问题需要调试细节 help minimal reproducible example 目前不接受答案 在我的用户控件中 我有一个名为的 datagridviewdgvCustomers 我想在 gridview 中加载客户
  • 延长 R 中绘图轴的长度?

    如何在 R 中扩展轴线以覆盖数据范围 例如 在 我的数据大约为 2100 我希望 x 轴的线能走那么远 但不要在 2100 处做刻度线或标签 这在 R 中是否可能 这是用于制作上述绘图的代码 hist x breaks 50 xlab ma
  • 对python的LOAD_FAST/STORE_FAST感到困惑

    当我写一些代码时 我发现一个有趣的事情 def test l for i in range 10 def f pass print f l append f test import dis dis dis test 输出是
  • 如何从 pandas 邻接矩阵数据帧创建有向 networkx 图?

    我有一个以下形式的 pandas 数据框 df A B C D A 0 0 5 0 5 0 B 1 0 0 0 C 0 8 0 0 0 2 D 0 0 1 0 我正在尝试由此创建一个 networkx 图 我尝试过以下代码变体 A G ne
  • “cordova 平台添加 android”shasum 错误

    我正在完成设置和 HelloWorld 示例http cordova apache org docs en 3 5 0 guide cli index md html The 20Command Line 20Interface http
  • 当我导入 Xerces 库时无法构建应用程序(退出值 1)

    当我导入 Xerces 库时 我似乎无法构建我的应用程序 由于之前的问题 我已经在使用 multidex 因此我知道这一切都设置正确 我花了几天时间在网上查找并尝试各种版本的 Xerces 并对我的 build gradle 进行调整 但无
  • CSS open-quote 显示 1 个引号

    我使用以下 CSS 在段落前添加左引号 blockquote padding 22px quotes 201C 201D 2018 2019 font size 15px blockquote before color 111 conten
  • Postgres:整数范围的唯一约束

    给定两个整数 开始和结束 以及一个外键 我如何定义一个unique对区间 start end 和foreign key 的约束 鉴于我的表中有以下条目 start end foreign key 10 20 04ef8258 917c 46
  • Java中如何获取字符类型的类别名称?

    The Character getType int codePoint 返回一个整数 但我找不到方法 从中获取 unicode 类别名称 例如 Lu 或 Cn 我想要的是一种方法 例如Character getCategoryTypeNam
  • scala 中的构造函数(主/辅助/默认主)

    一个非常简单的练习凯霍斯特曼的 book Scala 适合不耐烦的人 一直让我困惑 是关于primary auxiliary and default primary构造函数 例如 5 10 考虑班级 class Employee val n
  • 不会采用父级
  • 我有一个 ul 与几个 li 其中的所有项目都在一行中 这 li li 有一个嵌套的 span and an img The img 所有项目的高度都相同 但是 span 项目包含可以跨越单行或两行的文本 取决于文本 我尝试过申请displ
  • ParseException:无效的会话令牌错误

    我做了一个简单的注册用户界面只是为了检查解析 但由于某种原因每次我尝试注册用户时都会出现此错误 这是代码 final ProgressDialog dlg new ProgressDialog this dlg setTitle Pleas
  • Java 中的内存映射集合

    我正在填满 JVM 堆空间 更改参数以为 JVM 提供更多堆空间 或更改代码中算法中的某些内容以不使用这么多空间是最推荐的两个选项 但是 如果这两个已经被尝试和应用 并且我仍然遇到内存不足的异常 我想看看其他选项是什么 我发现了这个例子 对
  • 使用 Keras (PIL) 和 TensorFlow 调整图像大小不一致?

    我对以下之间明显的不一致感到困扰 图像调整大小功能来自keras preprocessing 它们是 PIL 函数的包装器 TensorFlow 中的图像大小调整函数tf image 我正在使用 Keras 为计算机视觉任务训练深度学习模型
  • 如何提高 PostgreSQL 中带有游标的函数的性能?

    我有两个嵌套游标的功能 外部游标从源获取客户的付款详细信息 并根据某些业务逻辑插入到目标中 内部光标获取每笔付款的付款详细信息 它接连发生 Payments 表大约有 125000 行 其中大约 335000 行用于付款详细信息 所有这些行
  • 使用两个具有相同字符的分解对象断言 True

    我有两个 unicode 字符 两者具有相同的含义 这compat字符是对origin字符 这有意义 两者应该是相同的值 但是当我试图断言它们与条件相等时 它会返回False反而 origin korean letter for AE co
  • 通过“sed”将破折号插入字符串

    我有包含数字的 14 个字符行 如何在特定位置 即第 4 个位置 插入一个字符 所以 如果我有这样的字符串 xxxxxxxxxxxxxx 我怎样才能把它改成这样 xxxx xx xxxxxxxx 其中 x 代表数字 谢谢 伊雷克 如果你的台
  • 即使配置 SSL 属性后,Spring RMQ 侦听器也始终使用 PLAIN 身份验证

    我有一个 Spring Boot 应用程序 我正在尝试将侦听器配置为已有的队列 以下是我在我的配置中配置的application yml文件 我还用注释注释了我的配置类 EnableRabbit和听众 RabbitListener参考 sp
  • 即使方向是横向,Android也会加载drawable而不是drawable-land?

    我有一个启动屏幕 在主屏幕之前显示图像几秒钟Activity启动 它有一个纵向版本 drawable hdpi splash 和一个横向版本 drawable land hdpi 启动画面设置方向onCreate 我的问题 如果我将平板电脑
  • 如何检测CSS3调整大小事件

    CSS3 resize 属性可以分配给任意元素 我正在寻找一种方法来检测 div 上的此类调整大小 我不介意它目前仅在 Firefox 中工作 div resize horizontal overflow hidden 不幸的是 onres