jQuery效果运行顺利，但有时会变得jump - 直跳 - 为什么？

我一直在玩几个jQuery效果，当它们流畅运行时看起来很整洁，但有时（在脚本被调用的随机时间），效果锁定并跳转到最终结果。jQuery效果运行顺利，但有时会变得jump - 直跳 - 为什么？

//--Expand Panel 
$(".open-menu").live('click', function(){ 
    $("#wrap").css({ 'height' : newH + 'px' }); 
    $(".mini-menu").fadeOut(500); 
    $("#headerCompany").animate({ 
     marginLeft: '+=142' 
    }, 650); 
    $("#avatar_box").fadeIn(650); 
    $("#pinboard").fadeIn(550); 
    $("div#centerHeader").slideDown("slow"); 
    $("#toggle-pinboard a").removeClass("open-menu").addClass("close-menu"); 
    return false; 
}); 
// Collapse Panel 
$(".close-menu").live('click', function(){ 
    $("#wrap").css({ 'height' : newH + 'px' }); 
    $("#avatar_box").fadeOut(550); 
    $("#pinboard").fadeOut(550); 
    $("#headerCompany").animate({ 
     marginLeft: '-=142' 
    }, 650); 
    $("div#centerHeader").slideUp(750).delay(300); 
    $.post('resources/ajax/ajax.php', { 
     action: 'mini_menu' 
    }, function(menu){ 
     $("#mini-menu").hide().html(menu).addClass("mini-menu").fadeIn(1500); 
    }); 
    $("#toggle-pinboard a").removeClass("close-menu").addClass("open-menu"); 
    return false; 
});

PHP：

switch($post['action']) { 
    case 'mini_menu': 
     echo "<nav> 
       <a href='/' class='dashboard-menu-link'>Dashboard</a> 
       | <a href='contacts.php'>Contacts</a> 
       | <a href='mail.php'>Mail</a> 
       | <a href='files.php' class='files-menu-link'>Files</a> 
       | <a href='toolbox.php' id='toolbox-menu-link'>Toolbox</a> 
       | <a href='agenda.php' id='agenda-menu-link'>Agenda</a> 
       | <a href='settings.php' id='settings-menu-link'>Settings</a> 
      </nav>"; 
    break;

HTML：

<div id="header"> 
     <div id="topHeader"> 
      <div id="topHeaderGroup"> 
       <div id="headerCompany"> 
        <span><b><?=$company;?></b></span> 
       </div> 
    -------->>>  <span id="mini-menu"></span> <<<-------- 
       <div id="toggle-pinboard"> 
        <a id="toggle-menu" class="close-menu" href="#"><span></span></a> 
       </div> 
       <div id="headerWelcomeAccount"> 
        <div class="nav_profile_menu" > 
         <a href="helix-007"><span class="top-header-color-change">View My Profile</span></a>&nbsp;|&nbsp; 
         <a href="logout.php"><span class="top-header-color-change">Logout</span></a>&nbsp;|&nbsp; 
         <a href="#" class="menu_drop"><span class="top-header-color-change">My Account</span></a> 
        </div><!-- end nav_profile_menu --> 
       </div><!-- end headerWelcomeAccount --> 
      </div><!-- end topHeaderGroup --> 
     </div><!-- end topHeader --> 

     <div id="centerHeader"> 
      <div id="header_container"> 
       <div id="avatar_box" class="border trans_white_gloss"></div> 
       <div id="pinboard"></div> 
      </div> 
     </div><!-- end centerHeader --> 
    </div><!-- END HEADER -->

CSS：

.mini-menu { 
    margin: 0 auto; 
    width: 400px; 
    height: <?=$header_top_height;?>px; 
    /*float: left;*/ 
    color: #FFF; 
    padding-left: 20px; 
} 
.mini-menu a{ 
    color: #FFF; 
}

在Firefox 3.6测试与萤火虫在

来源

2011-01-23 Eli

需要更多细节：什么浏览器？你有没有尝试用较少的影响？你目前在同一时间运行五种不同的效果，当你只有2或3时会发生什么？ – 2011-01-23 09:45:39

大概

问题可能是您的硬件配置，浏览器版本

如果问题存在，那么我们就需要完整的代码和HTML您可以检查在多个平台上的效果。

来源

2011-01-23 09:50:10 Wazzzy

jQuery效果运行顺利，但有时会变得jump - 直跳 - 为什么？

回答

相关问题