JQuery .jimate jump issue

Question

Длительный слушатель, 1-й раз вызывающий. У меня есть сайт http://www.rivingtondesignhouse.com.php53-3.dfw1-1.websitetestlink.com/

Я хочу, чтобы гибкий слайдер анимировал вниз - я предпочитаю этот эффект для скольжения, в котором у меня нет проблем. Проблема в том, что при появлении ползунка возникает скачок. Как мы можем удалить этот прыжок?

Вот некоторые из моих 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 --> 

Все самое лучшее,

BB

Answer 1

Я считаю, что вам просто нужно установить отображение none в css, а не на ваш документ, готовый в jquery.

например:

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

таким образом вы Арент скрывается элемент после того, как он загружает - он должен загрузить скрытый то показать, что