jquery - li jQuery 动画

Question

拜托，有人可以帮助我吗？我无法从 li 菜单项调整 #top 的大小。这是html代码：

<div id="top"></div>
<div id="wrapper">
<div id="header">
<div id="topheader"></div>
<div id="baseheader">
<div id="logo"><img src="images/logo.png" width="260" height="131" /></div>
<div id="contentmenu"><div id="menu">
<ul id="nav">
<li id="nav1"><a href="#">ESTUDIO</a></li>
<li id="nav2"><a href="#">PORTFOLIO</a></li>
<li id="nav3"><a href="#">SERVICIOS</a></li>
<li id="nav4"><a href="#">PRESUPUESTO</a></li>
<li id="nav5"><a href="#">CONTACTO</a></li>
</ul>
</div></div>
</div>
</div>

和这个jQUERY

$("#nav li[id='nav4']").live('click', function(e) {
$("#top").animate({height:114});
});

Answer 1

我建议使用 .on()而不是.live()，“从 jQuery 1.7 开始，不推荐使用 .live() 方法”

<script type="text/javascript"> 
 $(document).ready(function(){ 
  $("#nav").on('click', '#nav4', function () {
    $("#top").animate({height:114});
     return false;
   });
 });
</script>  

http://jsfiddle.net/z4KrL/9/

并且不要使用所以菜单 ID 的使用类，例如

更新：

• 将代码从上方复制到页面底部
• 添加指向 Jquery 库的链接<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
• 删除外部链接topheight.js