jquery - 如何使 div 内容随着 div 收缩而变得模糊

标签 jquery css jquery-animate

如果这是重复的,看起来很可能,我在这里的其他任何地方都找不到它 - 我已经看过了!

我有一个 div,它使用 $(#myDiv).animate({width:'toggle'},1000) 出现和消失。它工作得很好,但问题是,随着 div 扩展和收缩,内容会动态调整大小,正如人们所期望的那样,因为我只是改变它的宽度。但我想要的是 div 的内容不调整大小,这样当 div 展开时内容会慢慢显示出来,而当它再次收缩时内容会隐藏起来.

我创建了一个 fiddle here来说明问题。

最佳答案

这应该有效:

  <div id="wrapper" style="overflow:hidden">
  <div id="content" style="width: 300px">

这是您修改后的 fiddle :http://www.bootply.com/Tj6NndCDJY

请注意,设置内部 div 的宽度是必不可少的,否则内部 div 将继承其收缩父级的宽度。

关于jquery - 如何使 div 内容随着 div 收缩而变得模糊,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27550300/

相关文章:

javascript - 有没有办法用 jQuery 为 textarea 的不透明度设置动画?

jquery - 复杂的 jQuery .hover 工作

android - 如何在 android 中为 .gif 图像设置动画?

javascript - 如何设置初始值为 'Hidden'

javascript - 将 jQuery 与我自己的文档对象结合使用

jquery - 有没有办法获取可调整大小的 div 的宽度和高度

javascript - 使用溢出文本为 scrollTo 设置动画

css - 我想清除Pentaho的Tomcat服务器的css/html缓存

javascript - HTML 中的 onLoad、onDomready、Nowrapp-in<head> 和 Nowrap-in<body> 有什么区别?

javascript - 页面初始加载后加载 jQuery 库