解决jquery的.animate()函数在IE6下的问题

在项目里面实现左的菜单折叠显示的效果，这个在软件界面里是常见的（本来到网上copy一段代码也就了事了，估计写的比我都好，但学习嘛，就要有学习的精神^^!）, 我是用.animate()去实现隐藏展开的，代码如下： 复制代码 代码如下: !DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd' html xmlns='http://www.w3.org/1999/xhtml' head meta http-equiv='Content-Type' content='text/html; charset=utf-8' / title无标题文档/title style !-- .left { width:100px; height:500px; background:#060; float:left; } #butid { width:10px; height:500px; background:#C00; float: left; } .content { width:500px; height:500px; background:#000; float:left; color: #FFF } -- /style /head body script type='text/javascript' src='https://www.6hehe.com/dnjc/thirdparty/jquery/jquery.js'/script script type='text/javascript' $(function(){ var i = 1;//设置状态判断 $(’#butid’).click(function(){ if(i == 1){ $(’.content’).animate({left: ’-=100px’,width: ’600px’}, 'slow'); $(’.left’).animate({width: ’0px’}, 'slow'); i = 2; }else{ $(’.content’).animate({left: ’0px’,width: ’500px’}, 'slow'); $(’.left’).animate({width: ’100px’}, 'slow');//fadeOut() i = 1; } }); }); /script div class='left'123/div div /div div class='content'123/div /body /html 如果这样子的话，在FF，IE7-8，chrome下执行是正常的。可是IE6下无法隐藏left，原因是因为ie6默认内容高宽度超出时，DIV会自动撑开。所以只要给.left{}加个overflow:hidden，问题也就解决~~ PS：本来早上是写个函数把.left里面的内容隐藏掉的，在写博文的时候突然想通了这个原理，还以为是.animate()在IE6下有BUG 您可能感兴趣的文章:解决jQuery ajax请求在IE6中莫名中断的问题jQuery解决IE6、7、8不能使用 JSON.stringify 函数的问题jquery fancybox ie6不显示关闭按钮的解决办法jquery submit ie6下失效的原因分析及解决方法关于jquery中动态增加select,事件无效的快速解决方法jQuery:delegate中select()不起作用的解决方法(实例讲解)jquery html动态生成select标签出问题的解决方法jQuery选中select控件 无法设置selected的解决方法jQuery 跨域访问问题解决方法jquery的ajax()函数传值中文乱码解决方法介绍jQuery在ie6下无法设置select选中的解决方法详解