javascript - 带有正文溢出的 Firefox CSS 转换 :hidden

标签 javascript html css firefox transition

添加 overflow: hidden 后,CSS 转换在 FireFox 中停止工作到 <body>通过 JavaScript 标记。 (至少在 OSX10.9.5 上运行的 FF32.0.3 上)

当通过 JavaScript 添加溢出时,CSS 过渡不会触发:

http://jsfiddle.net/8rc7kk28/2/

在不添加溢出的情况下,CSS 过渡效果很好:

http://jsfiddle.net/8rc7kk28/3/

我怎样才能让第一个例子起作用?我需要维护 overflow: hidden<body> 上标签。

最佳答案

找到解决方法:

http://jsfiddle.net/8rc7kk28/4/

  • 立即应用溢出:隐藏规则。
  • 通过 setTimeout 引入一个小延迟。
  • 延迟后添加触发 CSS 转换的类。

关于javascript - 带有正文溢出的 Firefox CSS 转换 :hidden,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26246494/

相关文章:

javascript - 如何使用 Jquery 设置总价和数量选项列表

javascript - 当我点击删除按钮而不是我要删除的特定元素时,总是第一个元素被删除

html - 如何 overflow hidden "at the top"?

android - React native box shadow图像解决方案

javascript - promise 取消仍在触发履行功能

javascript - 如何在 Bootstrap 中动态添加行

javascript - 如何在 Node.js 中执行一组同步和异步函数

javascript - 使用ng2-charts,如何 "zoom out"?

html - 放大和缩小时如何防止图像移动?

css - 我正在尝试解决 CSS 转换的棘手问题。任何人?