<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> html,body { margin:0; padding:0; height:100%; } div.menu { width:46px; height:100%; background-color:#E6E6E6; position:absolute; left:0; } ul,li { margin:0; padding:0; padding:10px 2px; list-style:none; } div#arrow { position:absolute; left:0; bottom:50px; z-index:2; } </style> <script src="js/jquery.js"></script> <script> //用jquery1.8.3能用，别2.几没作用 $(function(){ $('#arrow img').toggle(function(){ $('div.menu').animate({ left:-46 },3000); $('#arrow img').attr('src','images/hao123/right.jpg'); },function(){ $('div.menu').animate({ left:0 },3000); $('#arrow img').attr('src','images/hao123/left.jpg'); }); }); </script> </head> <body> <div class="menu"> <ul> <li><img src="images/hao123/dongman.png" /></li> <li><img src="images/hao123/lol.png" /></li> <li><img src="images/hao123/meng.png" /></li> <li><img src="images/hao123/retie.png" /></li> </ul> </div> <div id="arrow"> <img src="images/hao123/left.jpg" /> </div> </body> </html>
在jquery1.8.3正常使用，2.X版本不行，原因是toggle函数的问题
