jquery的animate设置样式overflow:hidden的解决方法

来源：互联网发布：怎么可以做淘宝模特编辑：程序博客网时间：2024/05/22 09:50

环境：win7 64位,chrome44.0.2403.125,firefox43.0.4,ie11.0.9600.18124IS

问题：有个变高变宽的div，内嵌一个img，但是动画执行时img被overflow:hidden设置后只能看到一部分

解决方法1：

$(myDiv).animate(   { height: newHeight},   { duration: 500,      queue: false,      easing: 'easeOutExpo',      step: function() {       $(myDiv).css("overflow","visible");     },      complete: function() {       $(myDiv).css("overflow","visible");     }   });

参考：https://bugs.jquery.com/ticket/2648#no1

ps:好像complete不需要

解决方法2：

Another way is to declare the element as !important in css.
For example.

.somediv { overflow: visible !important;}

总结：jQuery.animate sets overflow:hidden as an inline style. Inline styles always take precedence over the !important flag

参考：http://stackoverflow.com/questions/3363035/jquery-animate-forces-style-overflowhidden

http://www.cnblogs.com/aim-at-is-the-tao-in/p/3753596.html

http://baike.baidu.com/link?url=3-wPSomyYQz7FtnSEqD1DlLxQTIu6TeJkXomazajR4ZKodLbgxLnYlrIxRmwwEhNNqnm_k7CslzAf8KJ19Vkj_

0 0