Hi, Earlier I found that treepluginview, http://groups.google.com/group/jquery-en/browse_thread/thread/773d6c6307eff840/ec8062b88f745e60?lnk=gst&q=treeview+collaspse#ec8062b88f745e60, didn't work well with IE7 or rather IE8 with IE7 mode. I traced it thru and the problem lies with animate(...) function and not so much to do treepluginview. I found setting the selector to the outer <ul id="tree"> rather than the <ul id="subtree"> block, the animation works for opening and closing the menu otherwise the menu closing action will be abrupt. How can I work around this for IE7? Or did I do something wrong here?
Thanks. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/ TR/xhtml11/DTD/xhtml11.dtd"> <html> <head> <link rel="stylesheet" href="Work_files/jquery.treeview.css" type="text/css" media="screen" /> <SCRIPT type=text/javascript src="Work_files/jquery-1.3.2.min.js"></ SCRIPT> <style type="text/css"> #browser { font-family: Verdana, helvetica, arial, sans-serif; font-size: 68.75%; } #tree { background-image: url('work_files/bg.jpg'); background-repeat:repeat-y; height: 100px; } </style> <script> $(document).ready(function() { heightToggle = function(animated, callback) { this.animate({ height: "toggle" }, animated, callback); } $('.openclose').bind("click", function(e) { /* if the selector is set to "#tree" and not "#subtree" then the tree will not collasped immediately */ $('#subtree').heightToggle(true); }); }); </script> </head> <body> <span class="openclose"><strong>Top</strong></span> <ul class="treeview" id="tree"> <li ><span ><strong>Home</strong></span> <ul id="subtree"> <li>Item X</li> <li><span>header</span> <ul> <li><a href="?y">Item Y</a> </li> </ul> </li> <li class="last"><a href="?z">Item Z</a></li> </ul> </li> </ul> </body> </html>