Jquery.animate跳轉問題

長時間監聽，第一次來電。我有一個網站http://www.rivingtondesignhouse.com.php53-3.dfw1-1.websitetestlink.com/Jquery.animate跳轉問題

我想有柔性滑塊動畫下來 - 我更喜歡這種效果滑動，我工作沒有問題。問題是，當滑塊出現時會導致跳轉。我們如何消除這種跳躍？

下面是一些我的jQuery

$(window).load(function() { 
    $('#home-slider').css("display", "none"); 

    var realH = $("#home-slider").width() * 0.4; 
    $("#home-slider").height(realH); 
    $('#home-slider').css('display', 'block'); 
    $('#home-slider').css('height', 'auto'); 
    $('#home-slider').addClass('bump2'); 
    $('#home-slider').animate({ 
     marginTop: '-44%' 
    }, 10); 
    $('#home-slider').removeClass('bump2'); 
    $('#home-slider').animate({ 
     marginTop: '0' 
    }, 1500, 'easeInOutExpo'); 
});

這裏是CSS：

#home-slider.flexslider { 
    background: url("images/slider-loader.gif") no-repeat scroll 50% 50% #FFFFFF; 
    height: auto; 
    margin: 0; 
    padding: 0; 
    width: 100%; 
    z-index: 1; 
    position:relative; 
} 
.bump2 { 
    position: relative !important; 
    padding-bottom: 44% !important; 
}

下面是一些HTML

<div id="home-slider" class="flexslider"> 
     <ul class="slides"> 

     <li> 
      <img src="http://www.rivingtondesignhouse.com.php53-3.dfw1-1.websitetestlink.com/wp-content/uploads/2013/09/HOME-PAGE-WELCOME-2.jpg" /> 

     </li> 



     </ul> 
    </div> 
    <!-- end slider -->

一切順利，

來源

2013-10-15 user2298128

您需要應用回調時.animate結束。現在，它只是一個大塊......而且它同時運行。在動畫製作剩下的動畫之前，您需要等待動畫完成。 –

我相信你只需要將display none設置爲css而不是在jquery中準備好的文檔中。

如：

#home-slider{ 
    display:none; 
    ... 
}

這樣它加載後您的arent隱藏元素 - 它應該加載隱藏，然後告訴你它是

來源

2013-10-15 16:50:32 Joe

Jquery.animate跳轉問題

回答

相關問題